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"
errortooltipenabled="True" />
<ajaxkit:MaskedEditValidator
id="FromDateMaskedEditValidator"
runat="server"
controlextender="FromDateMaskedEditExtender"
controltovalidate="FromDateTextBox"
emptyvaluemessage="Date is required"
invalidvaluemessage="Date is invalid"
display="Dynamic"
tooltipmessage="Input a date"
emptyvalueblurredtext="*"
invalidvalueblurredmessage="*"
validationgroup="MKE" />
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();
});