SitePoint Sponsor

User Tag List

Results 1 to 19 of 19
  1. #1
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy listbox validation problem

    hi all

    i have so many list box i have 3 values inside all the listbox
    like 1,2 ,3 these values are same for all list box
    if somebody choosed the same value (for eg: 2 for all list boxes) for all list box . i have to display a error message as don't choose same value
    any idea how to validate

    please help me.

  2. #2
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    When do you want to check? When they make a selection or when they go to submit the form?

    PS - it is .selectedIndex that you probably want to use to determine which item has been chosen in each list.
    Ian Anderson
    www.siteguru.co.uk

  3. #3
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    when we submitting the form

  4. #4
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Here's a test page.

    Code HTML4Strict:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    <HTML>
    <HEAD>
    <TITLE>Select Test</TITLE>
    <script type="text/javascript">
    function checkForm (frm) {
    	sel1 = frm.elements['sel1'].selectedIndex;
    	sel2 = frm.elements['sel2'].selectedIndex;
    	sel3 = frm.elements['sel3'].selectedIndex;
    	if (sel1 == sel2 || sel1 == sel3 || sel2 == sel3) {
    		alert ("Please ensure each droplist has a different option chosen!");
    		return false;
    	} else {
    		// Form OK - remove alert() line and make return true;
    		alert ("OK");
    		return false;
    	}
    }
    </script>
    </HEAD>
     
    <BODY>
    <form action="" onsubmit="return checkForm (this)">
    <select name="sel1">
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    	<option value="4">4</option>
    	<option value="5">5</option>
    </select>
    <br />
    <select name="sel2">
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    	<option value="4">4</option>
    	<option value="5">5</option>
    </select>
    <br />
    <select name="sel3">
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    	<option value="4">4</option>
    	<option value="5">5</option>
    </select>
    <br />
    <input type="submit">
    </form>
    </BODY>
    </HTML>
    Ian Anderson
    www.siteguru.co.uk

  5. #5
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your idea.But i have unlimited select box (i can't say whether it is 3 0r 100),In that case how i have to write the code

    I think i have to use for loop.but how can i count the number of listbox.

  6. #6
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    So ... is the criterion that ALL the droplists cannot be the same, but if ONE is different then that is OK?

    e.g. 10 droplists each with value options 1, 2 or 3. If all 10 droplists are set at 3 then error; if 9 droplists are set at 3 but 1 is set at 2 then OK.

    If yes ...

    Code HTML4Strict:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    <HTML>
    <HEAD>
    <TITLE>Select Test</TITLE>
    <script type="text/javascript">
    function checkForm (frm) {
    	var sels = new Array();
    	var j = 0;
    	for (var i=0; i<frm.length; i++) {
    		el = frm.elements[i];
    		if (el.type.indexOf("select") > -1) {
    			sel = el.selectedIndex;
    			if (sels.length == 0) {
    				sels[j] = sel;
    			} else {
    				for (var k=0; k<sels.length; k++) {
    					if (sels[k] != sel) {
    						j++;
    						sels[j] = sel;
    					}
    				}
    			}
    		}
    	}
     
        if (sels.length == 1) {
            alert ("Please ensure at least one droplist has a different option chosen!");
            return false;
        } else {
            // Form OK - remove alert() line and make return true;
            alert ("OK");
            return false;
        }
    }
    </script>
    </HEAD>
     
    <BODY>
    <form action="" onsubmit="return checkForm (this)">
    <select name="sel1">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel2">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel3">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel4">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel5">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel6">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel7">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel8">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel9">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <select name="sel10">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <br />
    <input type="submit">
    </form>
    </BODY>
    </HTML>
    There may be more elegant solutions, but this works.
    Ian Anderson
    www.siteguru.co.uk

  7. #7
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    Thanks for your reply.

    I have to choose different values each time.If i have same value in any list box I should display a error message


    Thanks

  8. #8
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    In which case your number of list boxes is related to the number of options. e.g. If there are only 3 values in the droplist then you can only have 3 droplists. My above two test files should give you all you need to know to make a function to suit your needs.
    Ian Anderson
    www.siteguru.co.uk

  9. #9
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Actually i have so many list boxes but I can't select more than 3 list boxes at a time (this is a restriction) .In that 3 select boxes,values should be different.

    if i have so many list box how it is ?

  10. #10
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    I think we need to understand what it is your page is about and trying to do before we can help further. Can you post the View:Source of your page as it is at the moment?
    Ian Anderson
    www.siteguru.co.uk

  11. #11
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your reply
    I have so many select boxes.

    I want to select a value from the select box ( i have only 3 values in all the select boxes . for eg only 1,2 and 3)

    I can select maximum 3 select boxes at a time(its a restriction,i can't select more than 3).
    now while i clicking on the submit button I have to check these 3 select box should not contain same values

    all the select boxes are dynamically displaying
    I hope now you got my point
    Thanks

  12. #12
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Post the View:Source HTML code of what you have at the moment (for the page) please. I understand the basics of what you ask, but the context makes no sense. The HTML source may help to clear this up.
    Ian Anderson
    www.siteguru.co.uk

  13. #13
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks

    HTML Code:
    <html>
    <head>
    <script type="text/javascript">
    function validate(f) {
    var selectCount=0;
    var total=0;
    for (var i=0;i<f.elements.length;i++) {
    if ("select-one"==f.elements[i].type) {
    if (f.elements[i].value > "0") {
    selectCount++;
    total+=+f.elements[i].value;
    }
    }
    }
    if (selectCount <3) {
    alert('please select atleast three');
    return false;
    }
    }
    </script>
    </head>
    <body>
    <form onsubmit="return validate(this)">
    <select>
    <option >select</option>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    </select><br>
    <select>
    <option >select</option>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    </select><br>
    <select>
    <option >select</option>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    </select><br>
    <select>
    <option >select</option>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    </select><br>
    <select>
    <option >select</option>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    </select><br>
    <select>
    <option >select</option>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    </select><br>
    <input type="submit">
    </form>
    </body>
    </html>

    I have a form with several select boxes which all have the same options . I would like to validate this form to require that the same option is not selected on more than one select box? I hope now you have got it.

  14. #14
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Jeez! Do you never think of giving your select elements names? How is the action page supposed to know WHICH select element is which?

    Nevertheless, simply loop through the form like I showed previously, identify the SELECT elements, count how many have a selectedIndex > 0, and of the 3 chosen check that each one has a different selectedIndex. It's just a tweak of my post #6.

    (Hint: if there are several droplists, and 3 are selected with different values, then the sels.length == 4. If it is not 4 then either not enough options are chosen [<4], or too many options are chosen [>4], or more than 1 chosen options have the same value [<4]).
    Ian Anderson
    www.siteguru.co.uk

  15. #15
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks
    (Hint: if there are several droplists, and 3 are selected with different values, then the sels.length == 4. If it is not 4 then either not enough options are chosen [<4], or too many options are chosen [>4], or more than 1 chosen options have the same value [<4]).
    how sels.length==4 ? here

    i am not getting

  16. #16
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I got another logic

    but no idea how to do

    use document.getELementsBYTagName("select");

    the above will give me an array of all list boxes,
    1. now get the first value from the first listbox
    2. compare it with all values in all other listboxes one by one,
    3. if any entry matched show a message

  17. #17
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    sels.length == 4 because non-selected droplists will have selectedIndex = 0, then the 3 chosen droplists will have selectedIndex = 1, 2 or 3. Hence a total of 4 selections.

    What I have given you and explained does exactly what you need - all you need to do is tweak it to use the correct if() tests and alert() the required messages.

    I've all but given you a fully-working function ... the least you can do is try to do some work yourself.
    Ian Anderson
    www.siteguru.co.uk

  18. #18
    SitePoint Addict aniltc's Avatar
    Join Date
    Nov 2006
    Location
    INDIA
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your help

  19. #19
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,629
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    I was bored, so here's a working solution. Only 3 droplists are allowed to be selected, and each must have a different value else an error message is shown.

    Code HTML4Strict:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    <HTML>
    <HEAD>
    <TITLE>Select Test</TITLE>
    <script type="text/javascript">
    function checkForm (frm) {
    	var sels = new Array();
    	var jj = 0;
    	var kk = 0;
    	for (var i=0; i<frm.length; i++) {
    		el = frm.elements[i];
    		if (el.type.indexOf("select") > -1) {
    			sel = el.selectedIndex;
     
    			// Let's determine the number of chosen droplists
    			if (sel > 0) {
    				sels[jj] = sel;
    				jj++;
    			}
    			// Let's see if more than one droplist has same value
    			for (var k=0; k<jj-1; k++) {
    				if (sels[k] == sel) {
    					kk++;
    					break;
    				}
    			}
    		}
    	}
     
    	if (jj == 3 && kk == 0) {
    		// Form OK - remove alert() line and make return true;
    		alert ("OK");
    		return false;
    	} else {
    		alert ("Please ensure only 3 droplists are selected, and each has a different option chosen!");
    		return false;
    	}
    }
    </script>
    </HEAD>
     
    <BODY>
    <form action="" onsubmit="return checkForm (this)">
    <select name="sel1">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel2">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel3">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel4">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel5">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel6">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel7">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel8">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel9">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <select name="sel10">
    	<option value="0" selected="selected">Choose</option>
    	<option value="1">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select>
    <br />
    <input type="submit">
    </form>
    </BODY>
    </HTML>
    Ian Anderson
    www.siteguru.co.uk


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
  •