Does anyone know if there is a way to prevent the Ajax CalendarExtender from displaying recently selected dates (like the 2018-03-05, etc. in below screenshot)? I also wasn't sure if this was a browser feature, but I have unselected all of the predictive options in my Chrome browser, cleared all history/cache, shut the browser down completely and it's still showing the dates. This is an ASP.NET, C# application.
I've never had much success with getting jQuery to work, but here is what I have so far:
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$('tbStartDate').on('click', function(e) {
e.preventDefault();
$(this).attr("autocomplete", "off");
});
$('tbEndDate').on('click', function(e) {
e.preventDefault();
$(this).attr("autocomplete", "off");
});
</script>
<asp:TextBox ID="tbStartDate" runat="server"></asp:TextBox>
<asp:CalendarExtender runat="server" TargetControlID="tbStartDate"></asp:CalendarExtender>
<asp:TextBox ID="tbEndDate" runat="server"></asp:TextBox>
<asp:CalendarExtender runat="server" TargetControlID="tbEndDate"></asp:CalendarExtender>
But I'm getting the "Uncaught TypeError: $(...).on is not a function at VendorFreightCalc.aspx:16, which points at the first jQuery line above.
Please have a look at this question:
Disable autocomplete for all jquery datepicker inputs
Basically, you want to turn off autocomplete for that field.
(UPDATE)
Maybe try the non-jquery options for turning off autocomplete.
<input type="text" name="field1" value="" autocomplete="off" />
Related
So I want to include a mask to my textbox. I have researched for different options and I have tried all of them but none seem to work. Im using VS2013 and C# and I want to be able to use textbox.text on my code too.
I have something like this:
<script type="text/javascript" src="/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="/js/jquery.maskedinput.js"></script>
<script type="text/javascript">
$(function () {
$("#TxtDOB").mask("999-999-9999");
});
</script>
asp:TextBox ID="TxtDOB" runat="server" CssClass="textbox1" Width="130px" />
TextBox won't recognize the mask.
I'm a bit late to the party, but adding ClientIDMode="static" should fix the issue here. By default, .Net will convert the ID ("TxtDOB" in this case) to something other than what you set it to. Adding ClientIDMode="static" tells .Net not to change the ID and make it available as-is on the client-side.
<asp:TextBox ID="TxtDOB" runat="server" ClientIDMode="static" CssClass="textbox1" Width="130px" />
I'm using DevExpress develop my website...Now i'm use Aspxtextbox with jquery to display datepicker. I don't use AspxDateEdit because i can't apply my css...Here is my code:
Javascript
$(function () {
$("#<%= txtDate.ClientID %>").datepicker(
{ dateFormat: 'dd/mm/yy', minDate: 0 })
});
ASPX
<dx:ASPxTextBox Native="true" CssClass="span3" runat="server" ID="txtDate">
<ValidationSettings ErrorDisplayMode="Text" ErrorFrameStyle-ForeColor="Red" Display="Dynamic" ErrorTextPosition="Bottom" SetFocusOnError="true">
<RequiredField IsRequired="True" ErrorText="The value is required" />
</ValidationSettings>
</dx:ASPxTextBox>
When i view source code, input id = ContentPlaceHolder1_ctl00_txtDate..What's wrong in my code?
For the datepicker to work you need to reference both jQuery and THEN (note the order) -> jQuery UI.
So it will be something like this:
<script src="~/Scripts/jquery.js"></script>
<script src="~/Scripts/jquery-ui.js"></script>
<script src="~/Scripts/yourapp.js"></script>
I hope this helps.
EDIT
Also, not sure if the textbox ID is actually trimmed, so try to remove the spaces:
$("#<%=txtDate.ClientID %>")
I have three linkbuttons when the user selects the current link it should be red.but at present it even makes the visited link also red which should not be the case.can any one help regarding this?
<li>
<asp:LinkButton ID="lnkCat1" runat="server"
OnClick="lnkCat1_Click" CssClass="mylink"
OnClientClick="return changeColor();"></asp:LinkButton></li>
<script type="text/javascript">
function changeColor(e) {
e.style.color = "red";
}
}
</script>
try this code:
Please include jquery first
css
.red {
color: red;
}
javascript:
<script type="text/javascript">
function changeColor(e) {
$('.red').removeClass('red');
$(e).addClass("red");
}
</script>
this is raw javascript code, i.e. you don't need libraries like jQuery.
<li>
<asp:LinkButton ID="lnkCat1" runat="server"
OnClick="lnkCat1_Click" CssClass="mylink"
OnClientClick="return changeColor(this); return false;"></asp:LinkButton></li>
<script type="text/javascript">
function changeColor(e) {
e.style.color = "red";
}
</script>
this line
OnClientClick="return changeColor(this); return false;"
will pass the link element to the javascript function changeColor, and immediately return false, so the link's default action (visiting another page) never happens. (this may be different for IE)
your actual function also had an extra } in it.
I'd use something like Firebug or Chrome's developer tools, so you can view javascript errors as they appear
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
Detecting Unsaved Changes using JavaScript
My Web application has 3 web forms ,I implemented the validations in my webpage.I want to implement isdirty functionality in my web application.I want to pop up a message box in my webpage when a user clicks on sign out(which is a loginstatus control) if there any changes made to the form.
Environment:
Asp.net
VS2008
c#
This could be easily done with jquery and the onbeforeunload event. Using the .serialize() function you could calculate the state of the form on the returned string once when the page loads and then in the onbeforeunload event. Then compare the two values and if they are different something indeed has changed in the form.
Example:
<%# Page Language="C#" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<script type="text/javascript">
var data = '';
$(function () {
data = $('form').serialize();
});
window.onbeforeunload = function () {
if ($('form').serialize() !== data) {
return 'You have unsaved changes. Are you sure you want to navigate away?';
}
};
</script>
</head>
<body>
<form id="Form1" runat="server">
<asp:TextBox ID="FirstName" runat="server" />
<asp:TextBox ID="LastName" runat="server" TextMode="MultiLine" />
<asp:CheckBox ID="Chk" runat="server" />
<asp:HyperLink ID="Link" runat="server" Text="Go to Google" NavigateUrl="http://www.google.com" />
</form>
</body>
</html>
Some other techniques (like the one presented in the duplicate question that was voted to close for your question) involve in subscribing for the .change() event of the input elements but they are less reliable as the user could for example type abc in some input field and then delete it and if you used this technique the form would be considered as dirty although no value actually changed.
You can easily setup a popup/modal window to show-up when the user tries to leave a form/page. Here is a quick pure javascript example, that shows a message when you try to leave a page.
<body onunload="if (confirm('Save form ?')) { SaveFormMethod(); }">
If you need a better example, you should provide more details and show us your code.
Please take a look at this answer and see if it helps
I have the following ASPX page:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<script src="js/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.6.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$("#dialog").dialog({
bgiframe: true,
autoOpen: false,
height: 300,
modal: true,
buttons: {
'Ok': function() {
$(this).dialog('close');
__doPostBack('TreeNew', '');
},
Cancel: function() {
$(this).dialog('close');
}
},
close: function() {
;
}
});
});
function ShowDialog() {
$('#dialog').dialog('open');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="TreeNew" runat="server" Text="Nuevo" OnClientClick="ShowDialog(); return false;"/>
<asp:Label ID="Message" runat="server"></asp:Label>
<div id="dialog" title="Create new user">
<p id="validateTips">All form fields are required.</p>
<asp:RadioButtonList ID="ContentTypeList" runat="server">
<asp:ListItem Value="1">Text</asp:ListItem>
<asp:ListItem Value="2">Image</asp:ListItem>
<asp:ListItem Value="3">Audio</asp:ListItem>
<asp:ListItem Value="4">Video</asp:ListItem>
</asp:RadioButtonList>
</div>
</div>
</form>
</body>
</html>
When the user click on TreeNew button appears the modal dialog, then he/she choose an option an click Ok button to do a postback.
I need that the server side execute TreeNew_Click method: How can I do that?
If I use __doPostBack('TreeNew', '') it throws me the following error: "Object expected".
UPDATE:
I found the origin for the error: the function __doPostBack is not defined. I'm not going to delete the question because I think Chris Clark's answer is so interesting.
As a rule, if you find yourself ever typing the text "__doPostBack(...", you should re-evaluate your approach.
In this case, you should just put a server-side asp.net button inside the div that you are turning into the dialog and use that instead of the generates jQuery button. That way the postback code will get wired up for you. There is one caveat however - when jQuery turns your div (I'm going to assuming it's a div) into a dialog, it rips the div out of the form element. That means you have to attach it BACK to the form BEFORE the postback occurs. You can do that in the close function of the dialog. The postback will then occur properly.
If you really want to use the generated jQuery OK button, you have a couple of options. First, you can slap a server-side asp.net button on the page and hide it, then call the asp.net button's click event from the OK button's code. Second, you can emit a javascript function form the server using Page.ClientScript.GetPostBackEventReference that will contain the __doPostBack code that you were trying to hand-write above. Then call that emitted function from the OK button's JS code.