www.webdeveloper.com
Results 1 to 3 of 3

Thread: Question: counting single selected options (basic javascript, no jquery etc.)

  1. #1
    Join Date
    Mar 2014
    Posts
    1

    Question: counting single selected options (basic javascript, no jquery etc.)

    Okay so I've got a form that includes 4 different select fields.

    Code:
    <label for="type1">Type</label> 
     <select name="type1" id="type1" required>
     <option value="optA">first</option>
     <option value="optB">second</option>
     <option value="optC">third</option>
     </select>
    
    the other 3 fields are named type2, type3, and type 4, accordingly.

    Question is, how can I use javascript to count how many of a given option were selected across the four forms?

    The select forms use a typeX.value switch to impose a multiplier on a number input field, and I need to be able to count how many of an option were selected so that I can divide the sum of multiplied inputs by the count of selected options. All I'm asking is how to count the # of each selected option, though.

  2. #2
    Join Date
    Oct 2010
    Location
    Versailles, France
    Posts
    1,272
    Use the Select selectIndex Property with a loop for i=1,2,3 or 4 on document.getElemenById('type'+i).
    The only problem is that this property give 0 (for the first option) with no user action (See the page try It yourself). Then you have probably to add an action : Choose an option at the beginning of each select to detect this cases...
    Last edited by 007Julien; 03-04-2014 at 05:02 AM.

  3. #3
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,672
    also you can add an empty option to each select and then check all of your selects for empty value: if, for example, document.getElementById('type1').value='', that means this select has not been changed. so, now you know how many selects you have and how many of them have been changed.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles