We Keep Coding

asp.net textbox mask using jquery not working

I'm trying to use the jquery mask to apply to an ASP.NET web form textbox. Nothing I do works... what am I missing?
<script type="text/javascript" src="/js/jquery.maskedinput-1.2.2.js"></script>
<script type="text/javascript" src="/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
$(function() {
$("#phone").mask("999-999-9999");
});
</script>
This is the text box code:
<asp:TextBox runat="server" ID="phone" CssClass="rightsection" ToolTip="Please enter a phone number."></asp:TextBox>
<asp:RequiredFieldValidator runat="server" ControlToValidate="phone" Display="Dynamic" ForeColor="Red" Text="Required field" ValidationGroup="formfields" />

the textbox's id changes when it gets rendered to include the parent containers id, you can get the rendered id with ClientID like this
$("#<%= phone.ClientID%>").mask("999-999-9999");
The ClientID value is generated by concatenating the ID values of each parent naming container with the ID value of the control. In data-binding scenarios where multiple instances of a control are rendered, an incrementing value is inserted in front of the control's ID value. Each segment is separated by an underscore character (_).

This is the solution:
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="js/jquery.maskedinput.js"></script>

How to use Jquery Number Format plugin within an asp.net TextBox?

I've used this plugin with an html input and it worked with no problems,
however, when I try to implement using an asp.net textbox it doesn't work at all
Does someone know how can I implement it within a textbox from asp.net?
or maybe know if its possible to do so.
This is what I want to achieve using an asp.net textbox:
http://opensource.teamdf.com/number/examples/demo-as-you-type.html
Thank you so much, I really hope someone can enlighten me
UPDATE: code added.
asp.net control:
<asp:TextBox ID="txtNumberFormat" runat="server"></asp:TextBox>
References:
<script type="text/javascript" language="javascript" src="../../js/jquery.number.js"> </script>
<script type="text/javascript" language="javascript"src="../../js/jquery.number.min.js"></script>
JavaScript Code:
<script type="text/javascript">
$(function(){
$('#txtNumberFormat.ClientID').number( true, 2 );
});
</script>

Your jQuery is looking for a control that is literally named "txtNumberFormat.ClientID". You need
$('#<%= txtNumberFormat.ClientID %>').number( true, 2 );
so asp.net resolves the fully qualified client id inside your selector.

how to write internal jquery code in master page using asp.net?

this could be an easy question but i couldn't do it.
i am using the following code in the header of the master page but it didn't working also when i place it in the other web page that are inherited from this master page.
`<script type="text/javascript">
$(document).ready(function () {
$("#txtdate1").datepicker();
$("#txtdate2").datepicker();
});
</script>`
this was working fine in the single web page but i don't know to use it in asp.net while using master page in asp.net.
help will highly be appreciated.

I am guessing that.. control's clientID getting changed.
You can try :
First approach :
<script type="text/javascript">
$(document).ready(function () {
$("#'<%=txtdate1.ClientID %>'").datepicker();
$("#'<%=txtdate2.ClientID %>'").datepicker();
});
</script>
Second approach :
<script type="text/javascript">
$(document).ready(function () {
$("[id$='txtdate1']").datepicker();
$("[id$='txtdate2']").datepicker();
});
</script>
Third approach :
Make ClientID="Static" for the control, ID will be the same:
<asp:Textbox ID="txtdate1" runat="server" ClientID="Static" />
your same code will work :
<script type="text/javascript">
$(document).ready(function () {
$("#txtdate1").datepicker();
$("#txtdate2").datepicker();
});
</script>

can use clientID , CSS selector techniques for this purpose.
Eg.
$('#<%=txtdate1.ClientID%>').text();
Refer:
http://www.codeproject.com/Tips/471799/jQuery-introduction-and-how-to-use-jQuery-with-ASP

c# how to enable button ontextchange without posting back

so i have a lightbox in which pops up an aspx page with textboxes and two buttons (submit - disabled and cancel - enabled). I wanted to enable my submit button ontextchange. it works fine when opened separately (not as a lightbox) but when i let it run normally with the lightbox function everytime ontextchange gets triggered the whole page refreshes disabling the lightbox.
<asp:TextBox ID="textBox1" runat="server" OnTextChanged="OnTextChanged_AttributesEdited" autopostback="true">
protected void OnTextChanged_AttributesEdited(object sender, EventArgs e)
{
btnSubmit.Enabled = true;
}
now if i take out the "autopostback=true" it then will not trigger the the ontextchanged. was wondering if is it better if javascript will be the way to go for enabling the button or is there a way where i can prevent the postback when ontextchanged is triggered?
thanks a lot!

I think this would be a prime use for some jQuery in your application. Without posting back to the server for enabling / disabling a button, this would look a lot smoother, load faster and keep your current page state intact. An example might be as follows:
<script type="text/javascript">
$(document).ready(function() {
$("#textBox1").change(function() {
$("#btnSubmit").removeAttr("disabled");
});
});
</script>
Just put the above script tag in your HTML, just before closing the body tag.
An even better solution, however, would be to assign a specific CSS class to all the textboxes that should inherit that behaviour. Assuming that you assign a CSS class called "someCssClass" to all those textboxes, your script would then look something like this:
<script type="text/javascript">
$(document).ready(function() {
$("input.someCssClass").change(function() {
$("#btnSubmit").removeAttr("disabled");
});
});
</script>

I'd use jQuery as mentioned by #FarligOpptrenden, but if you don't have it and just want plain javascript, this should work.
Input within your lightbox:
<input type="text" id="textbox" onKeyUp="enableSubmitButton()" />
<input type="button" id="submitButton" value="Submit" />
<input type="button" id="cancelButton" value="Cancel" />
Javascript:
<script type="text/javascript">
function enableSubmitButton()
{
document.getElementById('submitButton').disabled = false;
document.getElementById('cancelButton').disabled = true;
}
</script>
You could also do your enabling/disabling buttons on load in javascript:
<script type="text/javascript">
window.onload = function () {
document.getElementById('submitButton').disabled = true;
document.getElementById('cancelButton').disabled = false;
}
</script>

Simulate a another button postback inside a jQuery dialog

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.