I would like to have a Javascript function to be called when ever my required field validator control is true (i.e when the validator control is fired / error message shown).
Kindly let me know how this can be done.
Thanks in advance.
You can call a JS function on OnClientlick of the button.
for ex.
function CheckValidation()
{
if (Page_ClientValidate())
{
// Call Your custom JS function and return value.
}
}
// Calling JS function
<asp:Button ID="btnSubmit" runat="server"
OnClientClick="return CheckValidation();" />
Assuming you're validating a TextBox control, the following snippet should do what you want:
<asp:TextBox id=txtZip runat=server OnChange="txtZipOnChange();" />
<asp:RegularExpressionValidator id="valZip" runat="server"
ControlToValidate="txtZip" ...>
<script>
function txtZipOnChange() {
// get the validator and check if it is valid
var val = <%= valZip.ClientID %>;
if (val.isvalid == false) {
// do something
}
}
</script>
Use CustomValidator control. Set the CustomValidator.ClientValidationFunction property to the javascript function and the CustomValidator.ValidateEmptyText property to false.
Related
I want to disable the form submit button when asp:RequiredFieldValidator shows error
please advise
if(Page_ClientValidate("SomeValidationGroup") == false)
document.getElementById("button1").disabled = true;
You could use this javascripot function onchange of the control which triggers validation:
<asp:TextBox id="TextBox1" runat=server OnChange="txtValidate();" />
<asp:RequiredFieldValidator id="validator1" runat="server"
ControlToValidate="TextBox1" ...>
<script>
function txtValidate() {
// trigger validation from clientside
var val = <%= validator1.ClientID %>;
if (val.isvalid == false) {
document.getElementById('btnSubmit').disabled = true;
}
}
</script>
Perhaps you can try something like this:
function WebForm_OnSubmit() {
if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) {
//disable button here
return false;
}
//enable button here
return true;
}
For more information about this function visit and understanding the ASP.NET Validation Library visit this post.
Alternatively, as #Nag suggested, a custom validator may also be able to accomplish this as you are able to define the client side JavaScript.
You should use validationgroup + requirevalidation then the button should not be clickable
In my aspx page in a submission form i have following html.
<p><asp:CheckBox ID="chkWishToDonateFrmTrust " runat="server" onclick="chkWishToDonateFrmTrustHandle(this)" />
Wish to donate from following Trust for future transactions</p><p> </p><p><textarea name="textarea" cols="45" rows="5" class="txtTrustDetails" runat="server"
id="txtTrustDetails" ></textarea></p>
I need to have a required field validation control to validate txtTrustDetails text area only if chkWishToDonateFrmTrust is checked by the user without server post backs for this.only javascript library I am using is Microsoft Ajax Framework.I also have to include this to validation group in form with some other for controls.I already know as my knowledge one required field validator control can only validate single UI control(asp.net forum thread) does anyone in community dealt with this kind of issue in intuitive way?
As another answer has said, use a Custom Validator and do something like this (not tested so may not be quite right...):
<script type="text/javascript">
function validate(sender, args) {
var checkBox = document.getElementById('<%=CheckBox1.ClientID %>');
var textBox = document.getElementById('<%=TextBox1.ClientID %>');
if (checkBox.checked == 1) {
if (textBox.value == '') {
args.IsValid = false;
} else { args.IsValid = true; }
}
}
</script>
<asp:CheckBox ID="CheckBox1" runat="server" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:CustomValidator ID="CustomValidator1" ControlToValidate="TextBox1" runat="server"
ErrorMessage="CustomValidator" ClientValidationFunction="validate"></asp:CustomValidator>
Use the custom validator and use the clientValidationfunction to call a javascript function to check your values.
You should also have a servervalidate function incase javascript is off.
you can use a js function or a jquery function to do this is a sample code of how to achieve this
function chkValidate()
{
if($("#chkWishToDonateFrmTrust ").checked)
{
if($("#txtTrustDetails").val()=='')
{
args.IsValid = false;
//your custom message according to you
}
}
}
call this function on your sumbit button onclick;
I have an asp:button with an onclick property that posts back to the server. I would like to do some validation on the contents of a textbox before I fire the postback. I want to do the validation in javascript using some regex.
I cannot use an asp:XXXXvalidator; I just can't due to what my web app does.
Is there a way to call a javascript function from an asp:button that then calls the postback?
I know I can use OnClientClick to call js from the asp:button, but once I call the JS how do I signal that I want to postback the button?
Create a javascript function which returns true/false on your check. If you return false, then the page will not be submitted to the server.
Pseudo-code:
<script type="text/javascript">
function check()
{
if( valid ) return true;
return false;
}
</script>
<asp:Button ID="btnAdd" runat="server" OnClientClick="return check()" OnClick="click" />
im trying this format:
$("#<%= hfWidth.UniqueID %>").val($("#drag").attr("offsetWidth"));
to fill the hidden field with client-side values
but when I do postback, the values doesn't seem to be saved.
help
If you want to get params from the server side, you should use name instead of id attribute.
And your code should work :
$("#elementId").val("value");
fixed it with <%= hfWidth.ClientID %>
in your aspx page:
<asp:HiddenField ID="hdn_checkbox" runat="server" />
in your Javascript:
function somefunction() {
$("#<%= hdn_checkbox.ClientID %>").val("test");
}
$('.btnGreen').click(function () {
somefunction();
alert($("#<%= hdn_checkbox.ClientID %>").val());
return true;
});
problem i have is that, the validation summary message(alert) is displayed twice. I cannot figure out the reason.
Please help.
Here is the code
function validate() //javascript function
{
if (typeof(Page_ClientValidate) == 'function')
{
var isPageValid = Page_ClientValidate();
if(isPageValid)
{
}
}
}
<asp:Button ID="btn1" runat="server" OnClientClick="validate()" Text="button"
ValidationGroup="ContactGroup" />
<asp:ValidationSummary ID="ValidationSummary1" runat="server" DisplayMode="List"
ShowMessageBox="true" ShowSummary="false" ValidationGroup="ContactGroup" />
The problem is that the function Page_ClientValidate takes an input parameter, if you don't specify the input then the validationsummary triggers once per groupname.
In your case, the function triggers twice: once for groupname="ContactGroup" and another time for groupname=""
you should change
var isPageValid = Page_ClientValidate();
to
var isPageValid = Page_ClientValidate('');
if you don't want to specify a ValidationGroup, or if you want to specify a groupname then you need to call Page_ClientValidate like so:
var isPageValid = Page_ClientValidate('ContactGroup');
First of all you should lose the ValidationGroup="ContactGroup" from the button because having validation group in it will first call of the validation on the page then the OnClientClick event that contains the validate function which will call the page validation once again.
Then you should pass the validation group "ContactGroup" to the Page_ClientValidate() function so it knows which controls to validate because simply calling Page_ClientValidate() will validate all controls regardless of their validation group(and it may display the validation message more than once, depending on how many validation groups you have).
In short do something like this:
function validate() //javascript function
{
if (typeof(Page_ClientValidate) == 'function')
{
var isPageValid = Page_ClientValidate('ContactGroup');
if(isPageValid)
{
//your custom code
}
}
}
<asp:textbox id="txtMyBox" runat="server"/>
<asp:requiredFieldValidator Id="rfv1" runat="server" ControlToValidate="txtMyBox"
ValidationGroup="ContactGroup" ErrorMessage="Bad!"/>
<asp:Button ID="btn1" runat="server" OnClientClick="validate()" Text="button"/>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" DisplayMode="List"
ShowMessageBox="true" ShowSummary="false" ValidationGroup="ContactGroup" />
just return false from the function and change the OnClientClick as shown below:
<asp:Button ID="btn1" runat="server" OnClientClick="return validate();" Text="button"
ValidationGroup="ContactGroup" />
function validate() //javascript function
{
if (typeof(Page_ClientValidate) == 'function')
{
var isPageValid = Page_ClientValidate();
if(isPageValid)
{
}
}
return false;
}
There is no need to manually call the Page_ClientValidate function, unless you're wanting to do the validation outside of a postback attempt.
Set the buttons CausesValidation to true. That'll run the validation.
You can make validation without show messages, use the following code segment,then use isPageValid variable:
if (Page_ValidationSummaries && Page_ValidationSummaries[0] && Page_ValidationSummaries[0].showmessagebox) {
var showMessagesOption = Page_ValidationSummaries[0].showmessagebox;
Page_ValidationSummaries[0].showmessagebox = "False";
isPageValid = Page_ClientValidate();
Page_ValidationSummaries[0].showmessagebox = showMessagesOption;
}
I know this is an old post, but here's a solution that may be more flexible. Similar to other users suggestions, this solution accepts the validation group that is passed by default by the asp.net validation controls. This way you would not need to add the OnClientClick="validate()" on the Button control.
//Make sure the Page_ClientValidate function exists
if (typeof (Page_ClientValidate) == "function") {
//Stash the old implementation in a temp variable
Page_ClientValidateOld = Page_ClientValidate;
//Create a new implementation and store it
//in Page_ClientValidate. Callers will now get
//this implementation.
Page_ClientValidate = function (validationGroup) {
var isValid;
//Call the old implementation first…
isValid = Page_ClientValidateOld(validationGroup);
//and then call our extension
if (!isValid) {
// Do something
}
return isValid;
}
}
If you want to read more on this approach, I recommend that you look at this blog post:
http://hyperthink.net/blog/interception-patterns-in-javascript/
Remove the click event of the button, that forces second validation I think.
remove the onclientclick event of button there is no need for that