Count Уникальный выбор из нескольких раскрывающихся списков

Question

Я новичок в jquery, я работаю над формой опроса, и у меня есть несколько выпадающих меню для разных вопросов, но все они имеют одинаковое значение выпадающего списка. Предположительно у меня есть:

<select name="Forms[AgentIsPitch]" id="Forms_AgentIsPitch"> 
<option value="">Choose One</option> 
<option value="Yes">Yes</option> 
<option value="No">No</option> 
<option value="N/A">N/A</option> 
</select> 


<select name="Forms[MandatoryOptIsStated]" id="Forms_MandatoryOptIsStated"> 
<option value="">Choose One</option> 
<option value="Yes">Yes</option> 
<option value="No">No</option> 
<option value="N/A">N/A</option> 
</select> 

И другие разные выпадающие списки с разными идентификаторами. Каков наилучший способ подсчета количества выбранных Да, Нет и N/A /? Благодаря

Answer 1

Вы можете сделать это просто этот путь

$('select').change(function() { 
    // get all selects 
    var allSelects = $('select'); 

    // set values count by type 
    var yes = 0; 
    var no = 0; 

    // for each select increase count 
    $.each(allSelects, function(i, s) { 
     // increase count 
     if($(s).val() == 'Yes') { yes++; } 
     if($(s).val() == 'No') { no++; } 
    }); 

    // update count values summary 
    $('.cnt-yes').text(yes); 
    $('.cnt-no').text(no); 
}); 

DEMO

Answer 2

В общем можно использовать change событие:

var results = {}; 

$('select').on('change', function() { 
    var val = $(this).val(); 
    results[val] = (results[val] || 0) + 1; 
}); 

DEMO

Если вы хотите подсчитать для каждого типа выбора:

$('select').on('change', function() { 
    var val = $(this).val(); 
    var name = $(this).attr('name'); 
    if (!results[name]) { 
     results[name] = {}; 
    } 
    results[name][val] = (results[name][val] || 0) + 1; 
}); 

DEMO

В results будет что-то вроде этого:

{ 
    "Forms[AgentIsPitch]": { 
     "Yes": 1, 
     "No": 2, 
     "N/A": 3 
    }, 
    "Forms[MandatoryOptIsStated]": { 
     "No": 5, 
     "N/A": 13 
    }, 
} 

UPD: для подсчета текущего выбора:

$('select').on('change', function() { 
    var results = {}; 

    $('select').each(function() { 
     var val = $(this).val(); 
     if (val) { 
      results[val] = (results[val] || 0) + 1; 
     } 
    }) 

    console.log(results); 
}); 

DEMO

Answer 3

Попробуйте это - https://jsfiddle.net/sergdenisov/h8sLxw6y/2/:

var count = {}; 
count.empty = $('select option:selected[value=""]').length; 
count.yes = $('select option:selected[value="Yes"]').length; 
count.no = $('select option:selected[value="No"]').length; 
count.nA = $('select option:selected[value="N/A"]').length; 

console.log(count); 

Answer 4

Мой способ сделать это будет:

var optionsYes = $("option[value$='Yes']:selected"); 
    var optionsNo = $("option[value$='No']:selected"); 
    var optionsNA = $("option[value$='N/A']:selected"); 

    console.log('number of yes selected = ' + optionsYes .length); 
    console.log('number of no selected = ' + optionsNo .length); 
    console.log('number of N/A selected = ' + optionsNA .length); 

Проверьте консоль (или заменить предупреждение).

С вашего кода, было бы что-то подобное (если вы хотите проверить на кнопку мыши события):

<select name="Forms[AgentIsPitch]" id="Forms_AgentIsPitch"> 
<option value="">Choose One</option> 
<option value="Yes">Yes</option> 
<option value="No">No</option> 
<option value="N/A">N/A</option> 
</select> 


<select name="Forms[MandatoryOptIsStated]" id="Forms_MandatoryOptIsStated"> 
<option value="">Choose One</option> 
<option value="Yes">Yes</option> 
<option value="No">No</option> 
<option value="N/A">N/A</option> 
</select> 

<button class="btn btn-primary" id="countYes"></button> 
<script type="text/javascript"> 
    $('#countYes').on('click', function(){ 
    var optionsYes = $("option[value$='Yes']:selected"); 
    var optionsNo = $("option[value$='No']:selected"); 
    var optionsNA = $("option[value$='N/A']:selected"); 

    console.log('number of yes selected = ' + optionsYes .length); 
    console.log('number of no selected = ' + optionsNo .length); 
    console.log('number of N/A selected = ' + optionsNA .length); 
    }); 
</script> 

Вы можете проверить на другом мероприятии, я выбранной выше нажмите кнопку мыши, например.

Answer 5

Существует вероятность экологически чистые способы сделать это, но это будет получить работу (при условии что нажатие кнопка, чтобы вызвать вещи):

$("#theButton").on('click', function() { 
    var totalSelect = 0; 
    var totalYes = 0; 
    var totalNo = 0; 
    var totalNA = 0; 

    $("select").each(function(){ 

     totalSelect++; 

     if ($(this).val() == "Yes") { totalYes++; } 
     if ($(this).val() == "No") { totalNo++; } 
     if ($(this).val() == "N/A") { totalNA++; } 

    }); 
}); 

Надеется, что это помогает делу.