SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Javascript Validation

    Javascript Validation

    I have 3 similar rows with 3 columns, one is dropdown box and other two are textarea. I want the users to enter atleast 1 set of it. The rest of 2 is fine if they dont enter.

    Suppose they select the value from dropdown and didnot enter anything in both text area, than on submit it shuld alert error message.

    Same thing shuld happen if the users enter in one text area and havenot enter or selected from dropdown box and another textarea.

    Here is my code.

    <tr>
    <td valign="top" width="4%">1</td>
    <td valign="top" width="3%">
    <select name="local[]">
    <option selected value="">Select...</option>
    <option value="Local">Local</option>
    <option value="Central">Central</option>
    </select></td>
    <td width="10%"><textarea rows="5" cols="30" name="duties[]">
    </textarea></td><td width="10%"><textarea rows="5" cols="30" name="skill[]">
    </textarea></td>
    </tr>

    <tr>
    <td valign="top" width="4%">2</td>
    <td valign="top" width="3%">
    <select name="local[]">
    <option selected value="">Select...</option>
    <option value="Local">Local</option>
    <option value="Central">Central</option>
    </select></td>
    <td width="10%"><textarea rows="5" cols="30" name="duties[]">
    </textarea></td><td width="10%"><textarea rows="5" cols="30" name="skill[]">
    </textarea></td>
    </tr>

    <tr>
    <td valign="top" width="4%">3</td>
    <td valign="top" width="3%">
    <select name="local[]">
    <option selected value="">Select...</option>
    <option value="Local">Local</option>
    <option value="Central">Central</option>
    </select></td>
    <td width="10%"><textarea rows="5" cols="30" name="duties[]">
    </textarea></td><td width="10%"><textarea rows="5" cols="30" name="skill[]">
    </textarea></td>
    </tr>

  2. #2
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2008
    Posts
    5,757
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    var localList = document.getElementsByName("local[]");
    var dutiesList = document.getElementsByName("duties[]");
    var skillList = document.getElementsByName("skill[]");
    Now you can use a for loop to loop through the fields. These arrays are related by thier index. For example, localList[0], dutiesList[0], skillList[0] are the fields from the first table row, and localList[1], dutiesList[1], skillList[1] are for the second row etc...

    So as you loop, you're going to be looking for one of two scenarios:
    -all 3 fields have a value
    -all 3 fields dont have a value

    If the row isnt able to meet one of those criteria, then an error should occur.

    Give it a shot and see how far you can get. For now, don't worry about them entering at least 1 set.

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    HI..thanks for your help....can you make the changes in my code...as i dont know how to create the javascript code......

    regards


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •