Click here to Skip to main content
11,410,750 members (63,382 online)
Rate this: bad
good
Please Sign up or sign in to vote.
See more: C# ASP.NET jQuery
hi all,

i have a large form. my form having 40 text box and 5 file uploads controls. only 20 text box are required and 1 file upload control is required.

my question is am enter the data in only 25 textboxes out of 40 textboxes. after then am click on the button. then automatically show and focus the required controls include fileupload controls also.

please help me. how to write jquery for validation script.

thanks and regards
Posted 21-Jan-13 1:33am
Edited 21-Jan-13 1:35am
v2
Comments
rizwan muhammed khan gouri at 21-Jan-13 7:11am
   
Please give your come...for more Understanding
Kishor Deshpande at 21-Jan-13 11:24am
   
Rather than having 40 text boxes, you can use Wizard control with validation for each wizard step.
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

If I understand what you are doing, which I'm guessing at a bit because your question is a little vague, is that you have a page which has multiple groups of textboxes and fileupload controls that are tied together. i.e. a textbox and a fileupload control make up a group.
One way to do this to simplify the look of the page is to create these controls dynamically using javascript as the user requests them. That means to use a client side "Add New Item" concept. When a user clicks "Add new item", then javascript will create a new control group to the page dynamically. That way when you want to do validation before submit you can just validate all the controls on the page that exist rather than trying to have to figure out which ones are used and which ones aren't. To do this, you can check out these links[^] for examples.
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

So if I understand this correctly, out of 40 text boxes 20 are mandatory and out of 5 uploads 1 is mandatory. If the text boxes and html inputs add a class say mandatory.
select all textboxes which are mandatory and loop through for text.

so say this is the tag:

<input type="text" class="mandatory" id="txtbx1" />
<input type="text" class="mandatory" id="txtbx2" />
<input type="text" class="mandatory" id="txtbx3" />
<input type="text" id="txtbx3" />
<input type="text" class="uploadTextBox" id="upTtx" /><input type="button" value="Upload" onclick="FillTextBox();" />
      <input type="text" class="uploadTextBox" readonly="readonly" /><input type="button" value="Upload" onclick="FillTextBox();" />
      <input type="text" class="uploadTextBox" readonly="readonly" /><input type="button" value="Upload" onclick="FillTextBox();" />
      <input type="text" class="uploadTextBox" readonly="readonly" /><input type="button" value="Upload" onclick="FillTextBox();" />


  <script>
       
        function Validate() {
            var areAllFieldsValidated = false;
            var isAtleastOneUploadAvailable=false;
            $('.mandatory').each(function () {
                //  debugger;
                if ($(this).val() == '') {
                    areAllFieldsValidated = false;
                    //$(this).addClass('ui-state-error'); //if you are using jQuery UI or you may add your own custom class
                    $(this).css({ 'background-color': 'Red' });
                }
                else {
                    $(this).css({ 'background-color': 'White' });//This is required so the red color is removed once user has fixed the errors and cick Submit again
                    areAllFieldsValidated = true;
                }
 
            });
            $('.uploadTextBox').each(function () {
                if ($(this).val() != '') {
                    isAtleastOneUploadAvailable = true;
                }
 
            });
            if (areAllFieldsValidated && isAtleastOneUploadAvailable)
            { alert('we are good'); }
            else if (!areAllFieldsValidated)
            { alert('Highlighted Fields missing') }
            else if (!isAtleastOneUploadAvailable) {
                $('.uploadTextBox').focus();
                alert('Upload at least one file.');
            }
    }
      
    
    </script>
 

This is on top of my head. Obviously it can be improved perhaps. You can also use some validation plugins to make life easier.

Hop this helps.
  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 Sergey Alexandrovich Kryukov 239
1 Sascha Lefévre 85
2 Dave Kreskowiak 80
3 Maciej Los 68
4 RyanDev 50
0 Sergey Alexandrovich Kryukov 8,885
1 OriginalGriff 6,915
2 Maciej Los 3,390
3 Abhinav S 3,248
4 Peter Leow 3,059


Advertise | Privacy | Mobile
Web01 | 2.8.150414.5 | Last Updated 21 Jan 2013
Copyright © CodeProject, 1999-2015
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100