AJAX :: MaskedEditExtender Mask Not Showing On TextBox
Sep 26, 2013
I am using the AJAX Toolkit MaskedEditExtender to format some of my web form's textboxes. When I load the page and start to enter data into the textboxes, the masking doesn't show. I've included my page code below:
<asp:TextBox ID="GrantExpendituresAmount" runat="server" Text='<%# Bind("GrantExpendituresAmount") %>'
Width="450px"></asp:TextBox>
<ajax:MaskedEditExtender ID="GrantExpendituresAmount_MaskedEditExtender"
runat="server" CultureAMPMPlaceholder="" CultureCurrencySymbolPlaceholder=""
CultureDateFormat="" CultureDatePlaceholder="" CultureDecimalPlaceholder=""
CultureThousandsPlaceholder="" CultureTimePlaceholder="" Enabled="True"
Mask="$999,999,999.00" TargetControlID="GrantExpendituresAmount">
</ajax:MaskedEditExtender>
View 1 Replies
Similar Messages:
Feb 11, 2010
I just started using the mask control. I have it working exactly the way I want with date but can't get the same behavior with Phone.
<AjaxControlToolkit:MaskedEditExtender
ID="mskTbTicketOpenedDate"
runat="server"
TargetControlID="tbTicketOpenedDate"
Mask="99/99/9999"
MessageValidatorTip="true"
OnFocusCssClass="MaskedEditFocus"
OnInvalidCssClass="MaskedEditError"
MaskType="Date"
ErrorTooltipEnabled="True" />
Date Mask Validator:
<asp:RequiredFieldValidator
ID="rfValTbTicketOpenedDate"
runat="server"
ControlToValidate="tbTicketOpenedDate"
Display="Dynamic"
ErrorMessage="required!<br />" />
<AjaxControlToolkit:MaskedEditValidator
ID="mskValTbTicketOpenedDateInvalid"
runat="server"
ControlExtender="mskTbTicketOpenedDate"
ControlToValidate="tbTicketOpenedDate"
IsValidEmpty="false"
InvalidValueMessage="Date is invalid<br />"
Display="Dynamic" />
Breaking out the required field validation helped me get the date textbox to behave the way I need. Just positioning validation messages and such. Behavior I like here is that TextBox has no mask to start (focus off of textbox). When you put the cursor in the textbox or the textbox gets focus then the mask shows up: __/__/____. As you type the underscore placeholders dissapear but the '/' chars stay in place.
And finally, this is key, when you have a correct date and take the focus away from the text box the dashes stay in place. I just realized that is because the date mask seems to fill in the blank spaces with the current date. I cannot get this behavior with a phone. Granted there is no phone mask type. Here is the phone code:
<AjaxControlToolkit:MaskedEditExtender
ID="mskTbPhone"
runat="server"
TargetControlID="tbPhone"
Mask="999-999-9999"
ClearMaskOnLostFocus="true"
MessageValidatorTip="true"
OnFocusCssClass="MaskedEditFocus"
OnInvalidCssClass="MaskedEditError"
MaskType="None"
ErrorTooltipEnabled="True" />
I have tried MaskType set to number but it doesn't change the behavior. Right now the dashes dissapear when I take the focus off of the phone textbox. One thing I noticed with date is that if it is incomplete when it loses focus it fills in the rest with the current date values. Since there is no Phone mask type that behavior is not built in. Does anyone know how to set a default behavior so if you type in 55 in would automatically finish? 555-55-5555 And when you take the focus off it would keep the dashes. But if the textbox is empty I want with no focus the mask should dissapear completely.
View 3 Replies
Feb 27, 2010
using java script with update panel. I have checkbox, textbox with MaskedEditExtender inside update panel in web content form. I want to change the mask for MaskedEditExtender when I check the checkbox without doing pastback for the update panel using java script
[Code]....
View 2 Replies
Feb 21, 2011
I want a TextBox with a mask like (xxx) xxx-xxxx using a MaskedEditExtender. I tried to set up the mask property to "(999) 999-9999" or "(999) 999-9999" but nothing works. It there a way I can have the mask I want?
View 2 Replies
Sep 24, 2010
I ran into a strange issue with the AJAX MaskedEditExtender control, the extender is used with the Mask="99/99/9999" and MaskType="Date". Initially when the page loads the textbox was set to readonly using textbox.Attributes.Add("readonly", "readonly") in the codebehind. After the page loads if the user clicks on a certain button it would change the textbox to editable using javascript code: textbox.readOnly = false. The strange thing is after that if you start typing in the textbox you can see the entire mask
(__/__/____) shifting to the right as you type. For example it looks something like this: 09__/__/____ instead of the normal 09/__/____.
If the textbox was never set to readonly in the first place this behavior won't happen. So it seems something got messed up when changing from readonly to not. I was able to reproduce this in a barebone aspx page with just the textbox, the mask extender, and a button that when clicked turning off the textbox's readonly. Anyone knows how I can fix this?
I'm using Ajax toolkit v3.0.30512
View 5 Replies
Apr 26, 2010
I have confronted a problem of using MaskedEditExtender when try to restrict user to input a number mask with mask. User input of course has no problem. The problem is when the system get the value from database or somewhere (doing assignation), the textbox show the wrong value with the following mask setting: I am writing to contribute and share my solution: example:
textbox1: 1.1 (user input) by using the following mask:
<asp:MaskedEditExtender ID="meeXML" runat="server"
TargetControlID="textbox1"
Mask="999.99"
MessageValidatorTip="true"
OnFocusCssClass="MaskedEditFocus"
OnInvalidCssClass="MaskedEditError"
MaskType="Number"
InputDirection="RightToLeft"
AcceptNegative="Left"
ClearMaskOnLostFocus="True"
ErrorTooltipEnabled="True"/>
When the system get back the data, textbox1 will show:
textbox1: 0.11 <- that is not the actual what I want:
==========================================
the solution:
==========================================
<asp:MaskedEditExtender ID="meeXML" runat="server"
TargetControlID="textbox1"
Mask="NNNNNNNNNNNN"
MessageValidatorTip="true"
OnFocusCssClass="MaskedEditFocus"
OnInvalidCssClass="MaskedEditError"
MaskType="Number"
InputDirection="RightToLeft"
AcceptNegative="Left"
ClearMaskOnLostFocus="True"
Filtered="."
ErrorTooltipEnabled="True"/>
View 1 Replies
Jan 18, 2010
How do I reach the mask property from the MaskedEditExtender control in the client side javascript?
[Code]....
View 4 Replies
Feb 1, 2010
I have a problem with MaskedEdit's mask for the code shown below:
[Code]....
When I'm starting to print date in the TextBox, mask moves with characters. Mask characters don't hide under typing characters.
View 7 Replies
Dec 4, 2010
I have a user control which contains a text box, which is added dynamically to another control containing a repeater control and then finally to the aspx. As my user control with the text box is added dynamically using code, I have learnt that using JQuery to apply a date mask won't because it is added to a placeholder and thus the id of the textbox control won't be found by the JQuery, which goes a long way to explain my problems.
Prior to trying out JQuery, I used AJAX third party control from codeplex, but I had to drop that control because of other issues.
Therefore, is there a way for me to apply a mask, such as "__/__/____" to a text box that does not reply on AJAX or JQuery?
View 5 Replies
May 24, 2010
the code like below, how to clear tbxDate when input an invalid date use javascript
[Code]....
View 3 Replies
Mar 19, 2010
I have a webform with two textboxes both with maskededitextender with date type, and a button.
When I press the button and the postback occurs the first textbox looses the value and shows the date mask.
What to do so this doesn't happen and the textbox doesn't loose the value.
View 3 Replies
Oct 6, 2010
I have a TextBox using the AjaxControlToolkit's MaskedEditExtender, the extender is using the Date mask (99/99/9999). We had modified the toolkit code to support 2-digit year (as seen in this post) which works just fine when the date TextBox initially has no value. But when the date TextBox has an existing date such as 10/04/2010, if I type in say 100409, it becomes 10/04/0910, in other words it doesn't replace the existing year but simply replace the first 2 digits of the year. If I first hightlight the entire field then type then it works. My question is is there a way to hightlight the entire date value of the TextBox upon entering the field?
I tried using javascript code textbox.focus() and .selet() but it doesn't highlight anything, it just places the cursor at the beginning of the textbox.
View 3 Replies
Jul 23, 2010
I want to create a custom control or user control using TextBox & MaskedEditExtender control.
I am going to add this control dynamically. So to avoid setting each property each time I tried to create a custom control like this.
[Code]....
but when user enters value and clicks on submit button I get empty string but in next submit I get the value.
View 1 Replies
Feb 28, 2010
I'm trying change an input mask for textbox when the the check box has been check or unckecked but the problem that always is picking up the else condation only even the check box it is check or not.
here is my code:
<%@ Page Title="" Language="C#" MasterPageFile="~/Imam.Master" AutoEventWireup="true"
CodeBehind="WebForm4.aspx.cs" Inherits="Imam_Contacts.WebForm4" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"> [code]...
View 3 Replies
Jul 8, 2010
I have an auto complete extender applied to my textbox as follows:
[Code]....
In the web pages code behind I have the following method:
[Code]....
there is no errors, I've tested and debugged the code inside GetCustomers() and it returns the data - just doesn't display it.
View 10 Replies
Oct 9, 2010
i m using ajax validatorCalloutextender with regular expression validator(for numeric values). It is working fine on a textbox but with same code on another textbox it is showing error msg this control is valid inspite of showing required error msg. The code is same for both textboxes.
View 2 Replies
Apr 27, 2010
I'm having some difficulty adding an autocomplete extender to a textbox and getting it working.
I've read through the samples and did a quick search on here, but cannot work out why it isn't working.
In a nutshell...
I've added a textbox onto a page, and added the autocomplete extender along with the AutoComplete page method.
Page
[Code]....
Code Behind
[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()]
public string[] GetCompletionList(string prefixText, int count, string contextKey)
{
StaffADBLL staff = new StaffADBLL();
DataTable dtStaff = staff.FindStaff(prefixText);
string[] items = new string[dtStaff.Rows.Count];
int i = 0;
foreach (DataRow row in dtStaff.Rows)
{
items.SetValue(row["displayName"].ToString(), i);
i++;
}
return items;
}
I've even tried adding an asmx file, and that doesn't work either.
I get no errors and when I start typing nothing happens, it doesn't even produce a list after 3 characters.
I tried to debug and it doesn't debug through the code, skips it completely.
View 6 Replies
Mar 9, 2010
I have a master/detail scheme for editing an asp:GridView using an asp:DetailsView. One of my fields is for a phone number of type int64 (always 10 digits). I would like this field to always be displayed as (###)###-####. My issue is the first digit in the phone number is always truncated for my edit item field which I used a MaskedEditExtender to achieve the formatting.
Here is my EditItemTemplate for the details view:
<cc1:MaskedEditExtender TargetControlID="edtPROJ_Leader_Phone" Mask="(999)999-9999" runat="server" ClearMaskOnLostFocus="false" ClipboardEnabled="true" MaskType="Number" />
<asp:TextBox ID="edtPROJ_Leader_Phone" runat="server" Text='<%# Bind("PROJ_Leader_Phone") %>' ></asp:TextBox>
When my details view is displayed for editing, the text box displays(_23)456-7890 for the integer 1234567890. Also worth noting that if the property MaskType="Number" is removed, the textbox shows:
(234)567-890_. I would of course have the textbox show (123)-546-67890 after binding.
View 2 Replies
May 19, 2010
Below is my code:
<asp:TextBox
ID="FromDateTextBox"
runat="server" />
<asp:ImageButton
ID="FromDateImageButton"
runat="server"
ImageUrl="~/images/calander.png" />
<ajaxkit:CalendarExtender
ID="FromDate"
runat="server"
TargetControlID="FromDateTextBox"
CssClass="CalanderControl"
PopupButtonID="FromDateImageButton"
Enabled="True" />
<ajaxkit:MaskedEditExtender
id="FromDateMaskedEditExtender"
runat="server"
targetcontrolid="FromDateTextBox"
Mask="99/99/9999"
messagevalidatortip="true"
onfocuscssclass="MaskedEditFocus"
oninvalidcssclass="MaskedEditError"
masktype="Date"
displaymoney="Left"
acceptnegative="Left"..........
I've set Culture="auto" UICulture="auto" in @Page directive and EnableScriptGlobalization="true" EnableScriptLocalization="true" in script manager to have client culture specific date format in my textbox.
I also have a Go button on my page on which I will do a partial post back. So, I want to validate the FromDateTextBox in javascript when the Go button is clicked.
UPDATE
I know how to create a javascript click handler. But because masked editor is already validating the date on focus shift, I'm thinking there should be some boolean property (like IsValid) exposed by it which will allow me to see if the text box contains valid date.
FURTHER TRIALS
I also tried below code and Page_Validators[f].isvalid always returns true even when the date is invalid and MaskEditValidator shows me a red star near the Text box.
function isDateValid() {
var b = true;
for (var f = 0; f < Page_Validators.length; f++) {
if (!Page_Validators[f].isvalid)
b = false;
}
return b;
}
$('#GoButton').click(function() {
if (!isDateValid()) {
return false;
}
loadProducts();
});
View 2 Replies
Jun 28, 2010
I am using MaskedEditExtender so that user can enter date inside textbox with specified mask like "DD/MM/YYYY".
i am facing problem when i am trying to assign value within text box from some string variable while when i am directly typing value within text box it's successfully enter like "28/06/2010"
How can i assign value within masked text box from variable. For mask text box i am using MaskedEditExtender of AJAX.
View 1 Replies
Mar 26, 2016
I want to set my textbox textmode="time"
View 1 Replies
Jul 12, 2010
We are using a MaskEditValidator to validate users input in a textbox which expects a date.
[Code]....
Our problem is that we would like that the textbox accepts two formats of date DD/MM/YYYY and DD/MM/YY, Can be possible to specify two types of mask in a MaskEditValidator ? Another idea how can we do this that users can enter the dates in the two formats and validate it ?
View 1 Replies
Feb 27, 2010
I have a masked edit control
[Code]....
But on post back in my button event I don't want to see the masked in the text box ( the dollar sign ).
Is there a method I can call that will wipe the mask out? I'd rather avoid having to call RegEx to clean it.
View 1 Replies
Jun 1, 2010
I have holiday manage screen (a date can be assigned with holiday)...so when user click on calendar I need to mask the days which are allocated with holidays...how to acheive this..
If possible can we show the title as holiday name when user mouse overs on date in the calendar
View 3 Replies
May 20, 2010
I'm having issues with a MaskedEdit on a textbox. I am using the the ClearTextOnInvalid property to prevent my user from inserting invalid information but when it deletes the text in textbox it does not clear the Mask.So if the user decides not to put anything in the box, I believe my code is seeing the mask as an invalid string. Is there a way to clear the mask after someone clicks out of the textbox? The ClearMaskOnLostFocus property is not working from textbox to textbox, only when no object has focus.
[Code]....
View 2 Replies
