У меня есть два списка, доступных и выбранных. Я хочу убедиться, что я удаляю все доступные варианты для доступных, если существует в выбранном.

При моем коде ниже все элементы добавляются в список доступных и ни один в выбранном. Что я делаю неправильно?

var availableTags = [];
var selectedTags = [];

var jsonAvailble = '[{"id":"1","name":"One"},{"id":"2","name":"Two"},{"id":"3","name":"Three"},{"id":"4","name":"Four"}]';
var jsonSelected = '[{"id":"4","name":"Four"}]';

availableTags = $.parseJSON(jsonAvailble);
selectedTags = $.parseJSON(jsonSelected);

for (var i = 0; i < availableTags.length; ++i) {

    //console.log($.inArray(availableTags[i].id, selectedTags));

    if ($.inArray(availableTags[i].id, selectedTags) >= 0) {

        $('#lstSelectedTags').append('<option value="' + availableTags[i].id + '">' + availableTags[i].name + '</option>');
    }
    else{
        $('#lstAvailableTags').append('<option value="' + availableTags[i].id + '">' + availableTags[i].name + '</option>');
    }
}
0
GoGetSOme 9 Янв 2017 в 20:11

3 ответа

Лучший ответ

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

var availableTags = [];
var selectedTags = [];

var jsonAvailble = '[{"id":"1","name":"One"},{"id":"2","name":"Two"},{"id":"3","name":"Three"},{"id":"4","name":"Four"}]';
var jsonSelected = '[{"id":"4","name":"Four"}]';

availableTags = $.parseJSON(jsonAvailble);
selectedTags = $.parseJSON(jsonSelected);
var selectedTags1=selectedTags.map(function(d) { return d['id']; });
for (var i = 0; i < availableTags.length; ++i) {

    if ($.inArray(availableTags[i].id, selectedTags1) != -1) {

        $('#lstSelectedTags').append('<option value="' + availableTags[i].id + '">' + availableTags[i].name + '</option>');
    }
    else{
        $('#lstAvailableTags').append('<option value="' + availableTags[i].id + '">' + availableTags[i].name + '</option>');
    }
}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    Selected:<select id="lstSelectedTags"></select>

Available:<select id="lstAvailableTags"></select>
0
Suchit kumar 9 Янв 2017 в 17:38

Вы можете использовать фильтр на доступных тегах для желаемого результата

В приведенном ниже рабочем примере я фильтрую все те элементы в availableTags, для которых значение присутствует в selectedTags.

var availableTags = [];
var selectedTags = [];

var jsonAvailble = '[{"id":"1","name":"One"},{"id":"2","name":"Two"},{"id":"3","name":"Three"},{"id":"4","name":"Four"}]';
var jsonSelected = '[{"id":"4","name":"Four"}]';

availableTags = $.parseJSON(jsonAvailble);
selectedTags = $.parseJSON(jsonSelected);


availableTags = availableTags.filter(function(elem) {

  if ($.grep(selectedTags, function(e) {
    return e.id == elem.id
  }).length == 0) return elem;

});


console.log(availableTags);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
0
Deep 9 Янв 2017 в 17:22

Или, идя старой школы:

var availableTags = [];
var selectedTags = [];

var jsonAvailble = '[{"id":"1","name":"One"},{"id":"2","name":"Two"},{"id":"3","name":"Three"},{"id":"4","name":"Four"}]';
var jsonSelected = '[{"id":"4","name":"Four"}]';

availableTags = $.parseJSON(jsonAvailble);
selectedTags = $.parseJSON(jsonSelected);

for (var i = 0; i < availableTags.length; ++i) {
  for (var j = 0; j < selectedTags.length; ++j) {
    console.log(availableTags[i].id + ", " + selectedTags[j].id)
    if (availableTags[i].id === selectedTags[j].id) {

      $('#lstSelectedTags').append('<option value="' + availableTags[i].id + '">' + availableTags[i].name + '</option>');
    } else {
      $('#lstAvailableTags').append('<option value="' + availableTags[i].id + '">' + availableTags[i].name + '</option>');
    }
  }

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="lstSelectedTags">

</select>
<select id="lstAvailableTags">

</select>
0
Snowmonkey 9 Янв 2017 в 17:27