473,396 Members | 1,797 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,396 software developers and data experts.

ErrorMessage "The field is required"

263 100+
Hello there.

Here is my problem with this aspx page integrated with javascript function validator:
  1. I need show in the javascript alert the ErrorMessage "The field is required", when validations is enabled;
  2. The aspx page and my GridView is not updated after inserting interval DateStart and DateEnd, why?
  3. The aspx page and my GridView is not updated after inserting interval DateStart1 and DateEnd1, why?
Can you help me?

If you have link for similar task, please give it me.
Can you explain any one or any sample code related this.

Your help would be very appreciated.
Thanks in advance for your time and hints.

Cheers.
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="button.aspx.cs" Inherits="SqlServer_button" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head id="Head1" runat="server">
  6.     <title></title>
  7. </head>
  8. <body onload="InitValidators()">
  9.     <form id="form1" runat="server">
  10.     <div>
  11.         <asp:ValidationSummary ID="ValidationSummary1" ShowMessageBox="true" runat="server"
  12.             ShowSummary="false" />
  13.         <asp:TextBox ID="DateStart" runat="server"></asp:TextBox>
  14.         <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="DateStart"
  15.             ErrorMessage="RequiredFieldValidator" Display="None"></asp:RequiredFieldValidator>
  16.         <asp:TextBox ID="DateEnd" runat="server"></asp:TextBox>
  17.         <asp:CompareValidator ID="CompareValidator1" runat="server" ErrorMessage="Not valid date!"
  18.             ControlToValidate="DateEnd" ControlToCompare="DateStart" Type="Date" Operator="GreaterThanEqual"
  19.             CssClass="redb" SetFocusOnError="false"></asp:CompareValidator>
  20.         <asp:ImageButton ID="Button1" ImageUrl="images/cerca_icon.gif" runat="server" OnClick="Button1_Click"
  21.             OnClientClick="javascript:InitValidators();return false;" />
  22.         <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="DateEnd"
  23.             ErrorMessage="RequiredFieldValidator" Display="None"></asp:RequiredFieldValidator>
  24.         <br />
  25.         <br />
  26.         <asp:TextBox ID="DateStart1" runat="server"></asp:TextBox>
  27.         <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="DateStart1"
  28.             ErrorMessage="RequiredFieldValidator" Display="None"></asp:RequiredFieldValidator>
  29.         <asp:TextBox ID="DateEnd1" runat="server"></asp:TextBox>
  30.         <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="DateEnd1"
  31.             ErrorMessage="RequiredFieldValidator" Display="None"></asp:RequiredFieldValidator>
  32.         <asp:CompareValidator ID="CompareValidator2" runat="server" ErrorMessage="Not valid date!"
  33.             ControlToValidate="DateEnd1" ControlToCompare="DateStart1" Type="Date" Operator="GreaterThanEqual"
  34.             CssClass="redb" SetFocusOnError="false"></asp:CompareValidator>
  35.         <asp:ImageButton ID="Button2" ImageUrl="images/cerca_icon.gif" runat="server" OnClick="Button2_Click"
  36.             OnClientClick="javascript:InitValidators();return false;" />
  37.         <asp:Label ID="MessagesLabel" runat="server" Text=""></asp:Label>
  38.         <br />
  39.         <br />
  40.     </div>
  41.     </form>
  42.     <script type="text/javascript" language="javascript">
  43.         function InitValidators() {
  44.  
  45.             var DateStart = document.getElementById('<%=DateStart.ClientID%>');
  46.             var DateEnd = document.getElementById('<%=DateEnd.ClientID%>')
  47.             var DateStart1 = document.getElementById('<%=DateStart1.ClientID%>');
  48.             var DateEnd1 = document.getElementById('<%=DateEnd1.ClientID%>')
  49.  
  50.             if (DateStart.value == '' || DateEnd.value == '') {
  51.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator1.ClientID%>'), true);
  52.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator2.ClientID%>'), true);
  53.             }
  54.             else {
  55.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator1.ClientID%>'), false);
  56.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator2.ClientID%>'), false);
  57.             }
  58.  
  59.             if (DateStart1.value == '' || DateEnd1.value == '') {
  60.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator3.ClientID%>'), true);
  61.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator4.ClientID%>'), true);
  62.             }
  63.             else {
  64.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator3.ClientID%>'), false);
  65.                 ValidatorEnable(document.getElementById('<%= RequiredFieldValidator4.ClientID%>'), false);
  66.             }
  67.  
  68.  
  69.         }
  70.     </script>
  71. </body>
  72. </html>
Attached Files
File Type: zip required.zip (1.1 KB, 106 views)
Aug 7 '12 #1

✓ answered by Claus Mygind

I don't work with asp, but from the looks of your code, you may want to separate the form validation javaScript from the actions run on the server. That is not to say you should not validate your data on the server before processing.

From your write up, it looks like you want to advise the user of missing data before the form is submitted. You can handle all that with javaScript no need for asp.

You speak of a grid, so I assume you may have more date fields than what is shown in your code. You can write a generic validator to which you pass an object reference to the control being checked instead of writing one for each of the controls.

One other recommendation would be to put all your javaScript in the header section of the html page.

I suspect that your validator does not work because you are waiting until the page hits the server.

Here is some old code that uses the "onChange" event handler. In today's modern code you may want to create a "change" eventlistener instead. But the code is a collection of control type validation, which may be useful to you in other ways.

It is standalone code, so you can just copy it and test it. This code does not use an server intervention. You could modify the code to give more specific information in the alert box or alter the color of the control, or even show all errors at once. But at least the code gives focus to the control that needs to be corrected.

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  2.   "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html>
  4. <head>
  5. <title>Validator Routines</title>
  6. <script type="text/javascript">
  7. // validates that the field value string has one or more characters in it
  8. function isNotEmpty(elem) {
  9.     var str = elem.value;
  10.     var re = /.+/;
  11.     if(!str.match(re)) {
  12.         alert("Please fill in the required field.");
  13.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  14.         return false;
  15.     } else {
  16.         return true;
  17.     }
  18. }
  19. //validates that the entry is a positive or negative number
  20. function isNumber(elem) {
  21.     var str = elem.value;
  22.     var re = /^[-]?\d*\.?\d*$/;
  23.     str = str.toString();
  24.     if (!str.match(re)) {
  25.         alert("Enter only numbers into the field.");
  26.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  27.         return false;
  28.     }
  29.     return true;
  30. }
  31. // validates that the entry is 16 characters long
  32. function isLen16(elem) {
  33.     var str = elem.value;
  34.     var re = /\b.{16}\b/;
  35.     if (!str.match(re)) {
  36.         alert("Entry does not contain the required 16 characters.");
  37.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  38.         return false;
  39.     } else {
  40.         return true;
  41.     }
  42. }
  43. // validates that the entry is formatted as an e-mail address
  44. function isEMailAddr(elem) {
  45.     var str = elem.value;
  46.     var re = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/;
  47.     if (!str.match(re)) {
  48.         alert("Verify the e-mail address format.");
  49.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  50.         return false;
  51.     } else {
  52.         return true;
  53.     }
  54. }
  55. // validate that the user made a selection other than default
  56. function isChosen(select) {
  57.     if (select.selectedIndex == 0) {
  58.         alert("Please make a choice from the list.");
  59.         return false;
  60.     } else {
  61.         return true;
  62.     }
  63. }
  64.  
  65. // validate that the user has checked one of the radio buttons
  66. function isValidRadio(radio) {
  67.     var valid = false;
  68.     for (var i = 0; i < radio.length; i++) {
  69.         if (radio[i].checked) {
  70.             return true;
  71.         }
  72.     }
  73.     alert("Make a choice from the radio buttons.");
  74.     return false;
  75. }
  76.  
  77. function focusElement(formName, elemName) {
  78.     var elem = document.forms[formName].elements[elemName];
  79.     elem.focus();
  80.     elem.select();
  81. }
  82.  
  83. // batch validation router
  84. function validateForm(form) {
  85.     if (isNotEmpty(form.name1)) {
  86.         if (isNotEmpty(form.name2)) {
  87.             if (isNotEmpty(form.eMail)) {
  88.                 if (isEMailAddr(form.eMail)) {
  89.                     if (isChosen(form.continent)) {
  90.                         if (isValidRadio(form.accept)) {
  91.                             return true;
  92.                         }
  93.                     }
  94.                 }
  95.             }
  96.         }
  97.     }
  98.     return false;
  99. }
  100. </script>
  101. </head>
  102. <body>
  103. <h1>Form Validations</h1>
  104. <hr /> 
  105. <form method="GET" action=""
  106.     name="sampleForm" onsubmit="return validateForm(this)">
  107. First Name: <input type="text" size="30" name="name1" id="name1" 
  108.     onchange="isNotEmpty(this)" /><br>
  109. Last Name: <input type="text" size="30" name="name2" id="name2" 
  110.     onchange="isNotEmpty(this)" /><br>
  111. E-mail Address: <input type="text" size="30" name="eMail" id="eMail" 
  112.     onchange="if (isNotEmpty(this)) {isEMailAddr(this)}" /><br>
  113. Your Region: <select name="continent" id="continent">
  114.     <option value="" selected>Choose One:</option>
  115.     <option value="Africa">Africa</option>
  116.     <option value="Asia">Asia</option>
  117.     <option value="Australia">Australia/Pacific</option>
  118.     <option value="Europe">Europe</option>
  119.     <option value="North America">North America</option>
  120.     <option value="South America">South America</option>
  121. </select><br>
  122. Licensing Terms: 
  123.     <input type="radio" name="accept" id="accept1" value="agree" />I agree
  124.     <input type="radio" name="accept" id="accept2" value="refuse" />I do not agree
  125. <br>
  126. <input type="reset" /> <input type="submit" />
  127. </form>
  128. </body>
  129. </html>
  130.  

3 4422
Claus Mygind
571 512MB
I don't work with asp, but from the looks of your code, you may want to separate the form validation javaScript from the actions run on the server. That is not to say you should not validate your data on the server before processing.

From your write up, it looks like you want to advise the user of missing data before the form is submitted. You can handle all that with javaScript no need for asp.

You speak of a grid, so I assume you may have more date fields than what is shown in your code. You can write a generic validator to which you pass an object reference to the control being checked instead of writing one for each of the controls.

One other recommendation would be to put all your javaScript in the header section of the html page.

I suspect that your validator does not work because you are waiting until the page hits the server.

Here is some old code that uses the "onChange" event handler. In today's modern code you may want to create a "change" eventlistener instead. But the code is a collection of control type validation, which may be useful to you in other ways.

It is standalone code, so you can just copy it and test it. This code does not use an server intervention. You could modify the code to give more specific information in the alert box or alter the color of the control, or even show all errors at once. But at least the code gives focus to the control that needs to be corrected.

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  2.   "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html>
  4. <head>
  5. <title>Validator Routines</title>
  6. <script type="text/javascript">
  7. // validates that the field value string has one or more characters in it
  8. function isNotEmpty(elem) {
  9.     var str = elem.value;
  10.     var re = /.+/;
  11.     if(!str.match(re)) {
  12.         alert("Please fill in the required field.");
  13.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  14.         return false;
  15.     } else {
  16.         return true;
  17.     }
  18. }
  19. //validates that the entry is a positive or negative number
  20. function isNumber(elem) {
  21.     var str = elem.value;
  22.     var re = /^[-]?\d*\.?\d*$/;
  23.     str = str.toString();
  24.     if (!str.match(re)) {
  25.         alert("Enter only numbers into the field.");
  26.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  27.         return false;
  28.     }
  29.     return true;
  30. }
  31. // validates that the entry is 16 characters long
  32. function isLen16(elem) {
  33.     var str = elem.value;
  34.     var re = /\b.{16}\b/;
  35.     if (!str.match(re)) {
  36.         alert("Entry does not contain the required 16 characters.");
  37.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  38.         return false;
  39.     } else {
  40.         return true;
  41.     }
  42. }
  43. // validates that the entry is formatted as an e-mail address
  44. function isEMailAddr(elem) {
  45.     var str = elem.value;
  46.     var re = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/;
  47.     if (!str.match(re)) {
  48.         alert("Verify the e-mail address format.");
  49.         setTimeout("focusElement('" + elem.form.name + "', '" + elem.name + "')", 0);
  50.         return false;
  51.     } else {
  52.         return true;
  53.     }
  54. }
  55. // validate that the user made a selection other than default
  56. function isChosen(select) {
  57.     if (select.selectedIndex == 0) {
  58.         alert("Please make a choice from the list.");
  59.         return false;
  60.     } else {
  61.         return true;
  62.     }
  63. }
  64.  
  65. // validate that the user has checked one of the radio buttons
  66. function isValidRadio(radio) {
  67.     var valid = false;
  68.     for (var i = 0; i < radio.length; i++) {
  69.         if (radio[i].checked) {
  70.             return true;
  71.         }
  72.     }
  73.     alert("Make a choice from the radio buttons.");
  74.     return false;
  75. }
  76.  
  77. function focusElement(formName, elemName) {
  78.     var elem = document.forms[formName].elements[elemName];
  79.     elem.focus();
  80.     elem.select();
  81. }
  82.  
  83. // batch validation router
  84. function validateForm(form) {
  85.     if (isNotEmpty(form.name1)) {
  86.         if (isNotEmpty(form.name2)) {
  87.             if (isNotEmpty(form.eMail)) {
  88.                 if (isEMailAddr(form.eMail)) {
  89.                     if (isChosen(form.continent)) {
  90.                         if (isValidRadio(form.accept)) {
  91.                             return true;
  92.                         }
  93.                     }
  94.                 }
  95.             }
  96.         }
  97.     }
  98.     return false;
  99. }
  100. </script>
  101. </head>
  102. <body>
  103. <h1>Form Validations</h1>
  104. <hr /> 
  105. <form method="GET" action=""
  106.     name="sampleForm" onsubmit="return validateForm(this)">
  107. First Name: <input type="text" size="30" name="name1" id="name1" 
  108.     onchange="isNotEmpty(this)" /><br>
  109. Last Name: <input type="text" size="30" name="name2" id="name2" 
  110.     onchange="isNotEmpty(this)" /><br>
  111. E-mail Address: <input type="text" size="30" name="eMail" id="eMail" 
  112.     onchange="if (isNotEmpty(this)) {isEMailAddr(this)}" /><br>
  113. Your Region: <select name="continent" id="continent">
  114.     <option value="" selected>Choose One:</option>
  115.     <option value="Africa">Africa</option>
  116.     <option value="Asia">Asia</option>
  117.     <option value="Australia">Australia/Pacific</option>
  118.     <option value="Europe">Europe</option>
  119.     <option value="North America">North America</option>
  120.     <option value="South America">South America</option>
  121. </select><br>
  122. Licensing Terms: 
  123.     <input type="radio" name="accept" id="accept1" value="agree" />I agree
  124.     <input type="radio" name="accept" id="accept2" value="refuse" />I do not agree
  125. <br>
  126. <input type="reset" /> <input type="submit" />
  127. </form>
  128. </body>
  129. </html>
  130.  
Aug 9 '12 #2
ariful alam
185 100+
To show a JavaScript Alert message you should validate your TextBox field in CodeBehind and on error you should register a JavaScript block to your .aspx page. It will show the message in JavaScript Alert message box.
Aug 9 '12 #3
viki1967
263 100+
Problem fixed, thanks a lot for help.
Aug 9 '12 #4

Sign in to post your reply or Sign up for a free account.

Similar topics

0
by: Robert | last post by:
I have python related stuff on some of my web pages. This month "The Python Robot" is going for over 400 MB / 4000 accesses downloads in my stats ! increasing frequency the last months!? thats...
6
by: Kalle Anke | last post by:
Those who have read my posts today have probably understood that I'm not a "true" Python programmer ... but I want to learn more (I think that Python is rather fun). I've read "Learning Python"...
0
by: elvin | last post by:
Okay - apologize in advance for the length, but I want to make sure all you knowledgeable and helpful people have all the details you need to hopefully point my newbie rear in the right direction....
5
by: F. Barth | last post by:
Hello, I've posted this problem to one other newsgroups, and gotten some diagnostic help, but I still need a solution. The full text of the message box is: "The field is too small to accept the...
1
by: RWC | last post by:
Hello, I'm getting the error "The field is too small to accept the amount of data you attempted to add. Try inserting or pasting less data" when I run a report. I'm simply trying to apply the...
1
by: BillCo | last post by:
I've been running a text-to-table import as part of a daily routine for years and I've just added a few new fields and updated the import spec. The strange thing is that it works perfectly when...
38
by: Jack Klein | last post by:
Many people, including me, like having hard copy books at hand, along with electronic editions. When I first heard of this book several months ago, I pre-ordered a copy. It arrived from...
2
by: zahaby | last post by:
Is it applicable to use the Microsoft Enterprise Library in Logging without using the configuration tool ? I would like to configure and choose the trace listener programmatically . Thanks in...
9
by: Dullme | last post by:
i can hardly know what is the code for this. I have researched palindromes, but unfortunately, I only have read about integers not for characters..I need some help..
3
by: töff | last post by:
On my site http://www.sjcga.com I have a javascript-generated navigation menu in the top right corner. The menu works great in IE and Opera ... but in FireFox, on the 1st click, the menu jumps...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.