Results 1 to 3 of 3

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

  1. #1
    Join Date
    Mar 2014

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

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

    <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>
    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
    Versailles, France
    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 04:02 AM.

  3. #3
    Join Date
    May 2006
    Somewhere behind your screen
    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.
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

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