Установить выбранное значение параметра множественного выбора как выбранное с помощью json

Question

Установить выбранное значение параметра множественного выбора как выбранное с помощью json

Я потратил почти два дня в поисках решения своей проблемы, но не нашел ни одного. Может быть, я недавно начал изучать Ajax & Jquery, я что-то пропустил.

Замечания: Мои все выбранные блоки выбраны Несколько выбора & все варианты жестко закодированы.

У меня есть несколько текстов & блоки выбора, в которых я хочу отображать / выбирать данные из базы вывода mysqli json, одно из одного события изменения блока выбора (в основном, с помощью этого пользователя можно копировать / редактировать существующие данные, сохраненные в БД для всего текста & выберите коробки).

Я успешно смог выполнить это для текстовых полей, используя следующий код js, который я изучил за последние два дня, чтобы выполнить свою задачу

$(document).ready(function ()
{
$('#posted_jobs').on('change', function ()
{
var selectedValue = $(this).val();
$.ajax
({
url: 'Copyvalue.php',
type: 'POST',
data: 'filter_job_id=' + selectedValue,
success: function(response)
{
var obj = $.parseJSON(response);//parse JSON
console.log(response);
//alert(JSON.stringify(obj));
$("#Job_Type").val(["Normal"]); // have tried manually adding value to selectbox here but not working
$('#Locations').val(obj[0].Job_type); // have tried manually adding value to selectbox here but not working
$('#Job_Type').val(obj[0].Job_type);
$('#Keywords').val(obj[0].Keywords);
$('#designation').val(obj[0].Designation);
$('#Company_name').val(obj[0].Company_Name);
$('#Contact_Person').val(obj[0].Contact_person_name);
$('#Contact_person_no').val(obj[0].Contact_No);
$('#Job_name').val(obj[0].Job_name);
}
});
});
});

я пробовал количество вариантов из переполнения стека & другие веб-предложения. но не в состоянии заставить это работать для коробок выбора. Пожалуйста, помогите мне получить это работает & Если возможно, скажите мне хороший источник, откуда я могу узнать это.

пробовал варианты, такие как

$("#Locations").val(["1, 2, 3, 4"]).prop("selected", false);
$("#Locations").val([1, 2]);

Мой скрипт PHP выводит Json в консоль Chrome

 [{"Job_id":"6","Employer_id":"2","creation_on":"2015-01-03 18:48:58","Keywords":"operation executive, manager operation, operation manager, executive operation","Job_type":"Normal","Designation":"Assistant Manager - Operation","Open_Positions":"4","Job_Description":"<p><strong>Good<\/strong> <em>Position<\/em><\/p>","Min_age":"23","Max_age":"34","Min_exp":"5","Max_exp":"12","Min_salary":"104","Max_salary":"109","Hide_Salary":"","Locations":"3, 4, 8, 45, 46","Industry":"10002, 10004","FA":"1002, 1003","Education":"4, 6, 9","Company_Name":"Aviva Life Insurance Company India Limited","About_Company":"<p><strong>Good<\/strong><em> Company<\/em><\/p>","Contact_person_name":"Balvinder Rayat","Contact_No":"9818906677","Refresh_type":"15","Response_type":"VC","Job_name":"Operation AM","Job_status":"Active"}]

Моя коробка выбора

<select id="Locations" name='Locations[]' style='width:100%;' data-placeholder='Type or select
locations' multiple class='chosen-select-no-results'>
<option value="1">Bangalore</option>
<option value="2">Chennai</option>
<option value="3">Delhi</option>
<option value="4">Gurgaon</option>
<option value="5">Hyderabad</option>
<option value="6">Kolkata</option>
<option value="7">Mumbai / Navi Mumbai</option>
</select>

3

jquery jquery-chosen json multi-select php

Решение

Другие решения

У меня тоже была похожая проблема при заселении <select> используя jQuery выбранный плагин и установить некоторые параметры, выбранные по умолчанию.
Подход, который я использовал в своем коде был похож,

Получите ответ JSON от вызова ajax
Заполните <select> элемент с использованием JSON
Итерация по <option> элементы
Обновите их с атрибутом «selected» (для определенных опций)

Фрагменты кода, которые я использовал, были следующими.

var response = "[{\"id\":\"1\",\"location\":\"Chennai\"},{\"id\":\"2\",\"location\":\"Bangalore\"},{\"id\":\"3\",\"location\":\"Hyderabad\"},  {\"id\":\"4\",\"location\":\"Goa\"},{\"id\":\"5\",\"location\":\"Delhi\"},{\"id\":\"6\",\"location\":\"Mumbai\"},{\"id\": \"7\",\"location\":\"Cochin\"},{\"id\":\"8\",\"location\":\"Trivandrum\"}]";

/*populate <select> with the list of locations*/
var locationList = JSON.parse(response);
$.each(locationList, function() {
$("#location-select").append($("<option/>")
.val(this.id).text(this.location));
});
$("#location-select").chosen({
no_results_text: "Oops, no location found!",
display_selected_options: false
});

/*Make some locations from the list to be selected by default*/
var selectedLoc = JSON.parse("[{\"id\":\"2\",\"location\":\"Bangalore\"},{\"id\":\"6\",\"location\":\"Mumbai\"},{\"id\": \"7\",\"location\":\"Cochin\"}]");

/*
*Create an array of locations, it can be array of id also,then
* the if condition should be
* if ($.inArray($(this).val(), users) != -1){...}
* This is because id is populated as
* <select>
*  <option value="id from json"> location from json </option>
* </select>
*/
var locations = [];
$.each(selectedLoc, function() {
locations.push(this.location);
});

$("#location-select option").each(function() {
if ($.inArray($(this).text(), locations) != -1) {
$(this).attr('selected', 'selected');
$("#location-select").trigger('chosen:updated');
return;
}
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen.jquery.min.js"></script>
<h3>
jQuery Chosen multiselect with selected values by default
</h3>
<select id="location-select" data-placeholder="Select locations..." style="width:95%;" multiple class="chosen-select"></select>

4

Я написал простой пример http://jsfiddle.net/f7z664u5/

вместо этой части

if($(this).val() == 1)
{
$(this).prop('selected', true);
}
if($(this).val() == 2)
{
$(this).prop('selected', true);
}

проверьте, является ли значение в массиве .. или в каком типе вы храните данные.

0

Это будет работать

$.each(objlist, function (index, value) {
$(".chosen-select option[value=" + value.id+ "]").attr("selected", "selected");
$(".chosen-select").trigger("chosen:updated");
});

0

Источник

Accepted Answer

я искал немного больше & получил решение (я думаю) для установки значения окна выбора специально для (выбрано поле выбора)

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

$("#Job_Type").val(obj[0].Job_type).trigger('chosen:updated');

Надеюсь, что это помогает другим !!

нашел ответ по этой ссылке Ссылка на сайт

Далее, для поля множественного выбора, если у вас есть значения, такие как [1,2,3,4], вы можете достичь результата, используя следующее:

var values = obj[0].Locations;
$.each(values.split(','), function(index, element)
{
$('#Locations').find('option[value="'+ element +'"]').attr('Selected', 'Selected');
$("#Locations").trigger('chosen:updated');
});

4