Динамически устанавливаемый атрибут множественного выбора с каждым выбором - PullRequest
Новая
       21

Динамически устанавливаемый атрибут множественного выбора с каждым выбором

0 голосов
/ 24 декабря 2018

У меня есть несколько полей выбора с множественным выбором в моей форме, и чтобы они выглядели хорошо, я использую выбор начальной загрузки.Поскольку ядро ​​этого приложения разработано в Express, я не могу получить значения, которые выбирает пользователь, потому что при начальной загрузке создается div и список, с которыми пользователь фактически взаимодействует.Чтобы решить эту проблему, я пытаюсь написать некоторый javascript / jquery для добавления selected = true к каждой выбранной опции.Я понял это, но потом понял, что если я отменю выбор опции, она все равно будет отображаться как selected = true.

Я пытался использовать $(this).find("option:not(:selected)").get(i).setAttribute('selected', false); Однако это выдает ошибку после многократного выбора.

HTML 

 <label for="performThese">I will perform</label>
 <select class="selectpicker show-tick form-control" multiple id="performThese" name="performThese" data-style="btn-secondary" title="Choose your option..">
   <option value="residential_BPO">Residential BPOs</option>
   <option value="commercial_valuation">Commercial Property Valuations</option>
   <option value="condition_report">Property Detail & Condition Reports</option>
  </select>

Javscript 

$(function() {
 // Style only selects with the selectpicker class
$('.selectpicker').selectpicker();
 // Get the target multiple select box for testing
let selectTarget = document.getElementsByName('performThese');
 // Wait for a change
$(selectTarget).on('change', function(e){
 // How many options selected?
let selectTargetLength = $(this).find("option:selected").length;
 // Make a blank array
let selectValue = [];
let i = 0;
while (i < selectTargetLength) {
 // Grab value of each choosen option in case needed for evaluation
  selectValue[i] = $(this).find("option:selected").get(i).value;
// Make options choose show as selected
  $(this).find("option:selected").get(i).setAttribute('selected', true);
  i++
}
});
})

Я ожидал, что выбрано = true, чтобы исчезнуть, когда я отменил выбор записи.

1 Ответ

0 голосов
/ 25 декабря 2018

Попробуйте это: 

$(function() {
 // Style only selects with the selectpicker class
$('.selectpicker').selectpicker();
 // Get the target multiple select box for testing
let selectTarget = document.getElementsByName('performThese');
 // Wait for a change
$(selectTarget).on('change', function(e){

    //firstly clean all options:
    $(this).find("option").attr("selected", false);

    //selected options are still available with find("option:selected")

    //marks all selected options:
    $(this).find("option:selected").attr("selected",true);

});
})
...