SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Addict The Mog's Avatar
    Join Date
    Dec 2002
    Location
    Manchester UK
    Posts
    310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question disable - enable Doing me head in

    Hi all,

    Very new to this javascript stuff so please bear with me.

    what i am trying to achieve is....

    i have a select box that holds "States" this fills the "City" selects with the cities that are in the selected state.

    this is working fine,

    Now i need to add a check box so that if you check the box it will disable the city select box.

    I have it sort of working but its only disabling one city select

    The city selectboxes are called city1 , city2, city3
    so basically you can choose either the entire state or a up to 5 cities.

    here is the code i have so far.

    HTML Code:
    function disable_city(obj)
    {
     obj.disabled = !(obj.disabled);
     var z = (obj.disabled) ? 'disabled' : 'enabled';
    }
    
     
    <TD align=middle colSpan=3><input type="checkbox" name="disable" value="disable"
       onClick=disable_city(document.forms[0].city);></P></TD>
     
    as you can see because i am only specifying "city" it only disables the select box named city, how can i make it disable city2 city3 etc?

    Thanks

    Kenny

  2. #2
    SitePoint Enthusiast webchick's Avatar
    Join Date
    Jun 2004
    Location
    in front of a computer
    Posts
    94
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can make multiple calls to disable_city(), giving it different city boxes each time. For example,

    HTML Code:
    onClick="disable_city(document.forms[0].city);disable_city(document.forms[0].city2);disable_city(document.forms[0].city3);">

  3. #3
    SitePoint Addict The Mog's Avatar
    Join Date
    Dec 2002
    Location
    Manchester UK
    Posts
    310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks, that works great,

    But now i want to change it slightly,

    Can you limit the number of selections in a list box to say 5?

    K-

  4. #4
    SitePoint Enthusiast webchick's Avatar
    Join Date
    Jun 2004
    Location
    in front of a computer
    Posts
    94
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This seems to work:

    HTML Code:
    <script type="text/javascript">
    <!--
    // list is the name of the listbox you want to check
    // max is the maximum selections to allow
    function checkMaxSelects(list, max) {
    	count = 0;
    	for (i = 0; i < list.length; i++) {
    		if (list.options[i].selected == true) {
    			count++;
    		}
    	}
    	if (count <= max) {
    		return true;
    	} else {
    		alert('You may only select up to ' + max + ' items.');
    		return false;
    	}
    }
    //-->
    </script>
    
    ...
    
      <select name="select" size="10" multiple="multiple" onchange="checkMaxSelects(this, 5);">
        <option value="1">One</option>
        <option value="2">Two</option>
        <option value="3">Three</option>
        <option value="4">Four</option>
        <option value="5">Five</option>
        <option value="6">Six</option>
        <option value="7">Seven</option>
        <option value="8">Eight</option>
        <option value="9">Nine</option>
        <option value="10">Ten</option>
      </select>
    Note that this won't prevent someone from submitting the form, only inform them that they've selected too many boxes.

    To prevent a user from submitting the form (as long as they have javascript enabled), you can also put a call to the function in the form's onsubmit event:

    HTML Code:
    <form action="whatever" method="post" onsubmit="return checkMaxSelects(document.forms[0].select, 5)">
    Hope that helps.


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
  •