<%@ Page Language="c#" AutoEventWireup="true" Inherits="Telerik.TextBoxExamples.Overview.DefaultCS" CodeFile="DefaultCS.aspx.cs" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
<title>Telerik ASP.NET Example</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function pageLoad() {
setTimeout(function () {
document.getElementById("<%=ResultLabel.ClientID%>").innerHTML = "";
}, 3000);
// Set a unique autocomplete value for all input elements on the page
Array.from($('input')).forEach((e) => {
$(e).attr('autocomplete', Date.now().toString(36) + Math.random().toString(36).substring(2));
});
}
</script>
</telerik:RadCodeBlock>
<div class="demo-containers">
<div class="demo-container wrapper">
<telerik:RadAjaxPanel runat="server" CssClass="demo-container demo-content">
<asp:Label ID="Label1" runat="server" Text="Username:" Width="80px"></asp:Label>
<telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="RadTextBox1" Width="200px" EmptyMessage="Enter username">
</telerik:RadTextBox>
<asp:RequiredFieldValidator runat="server" ControlToValidate="RadTextBox1" ErrorMessage="!" ForeColor="Red"></asp:RequiredFieldValidator>
<br />
<asp:Label ID="Label2" runat="server" Text="Password:" Width="80px"></asp:Label>
<telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="RadTextBox2" Width="200px" TextMode="Password"></telerik:RadTextBox>
<asp:RequiredFieldValidator runat="server" ControlToValidate="RadTextBox2" ErrorMessage="!" ForeColor="Red"></asp:RequiredFieldValidator>
<br />
<asp:Label ID="Label3" runat="server" Text="Comment:" Width="80px"></asp:Label>
<telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="RadTextBox3" Width="200px" EmptyMessage="Enter comment" TextMode="MultiLine" Height="100px" Resize="None"></telerik:RadTextBox><br />
<asp:Label runat="server" ID="ResultLabel" CssClass="resultLabel"></asp:Label>
<telerik:RadButton RenderMode="Lightweight" runat="server" ID="RadButton1" Text="Sign in" CssClass="submitButton" Width="100px" Style="float:right;" OnClick="RadButton1_Click"></telerik:RadButton>
</telerik:RadAjaxPanel>
</div>
</div>
<script>
function Load(sender, args) {
// Locate the wrapper span by the sender (the RadTextBox instance)
const wrapperSpan = sender.get_element().closest("span");
// Find the first input element within that span
const firstInput = wrapperSpan.querySelector("input[type='text']");
// Set the autocomplete attribute to "off"
if (firstInput) {
firstInput.setAttribute("autocomplete", "off");
disableAutoFill(sender);
}
}
function disableAutoFill(control) {
function focusHandler(ev) {
this.originalName = this.name;
this.name = new Date().toString();
}
function blurHandler(ev) {
this.name = this.originalName;
}
if (Telerik.Web.UI.RadComboBox && control instanceof Telerik.Web.UI.RadComboBox) {
$telerik.$(control.get_inputDomElement()).on({
focus: focusHandler,
blur: blurHandler
});
} else if (Telerik.Web.UI.RadTextBox && control instanceof Telerik.Web.UI.RadTextBox) {
$telerik.$(control.get_element()).on({
focus: focusHandler,
blur: blurHandler
});
}
}
</script>
</form>
</body>
</html>