Как установить значение выбора из базы данных в плагине jquery selectize - PullRequest
Новая
       33

Как установить значение выбора из базы данных в плагине jquery selectize

1 голос
/ 01 октября 2019

Я новичок в jQuery selectize, и у меня возникают проблемы при установке значения <select> из базы данных во время редактирования формы. <option> жестко закодировано в HTML.

HTML: 

<select class="form-control" name="agentType" id="agentType">
    <option value="">--Select Agent Type--</option>
    <option value="Individual">Individual</option>
    <option value="Partner">Partner</option>
</select>

Предположим, что эти два значения сохранены в базе данных, а именно: для отдельных лиц и партнеров.

database

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

beforeAfter

Jquery: 

$('#agentDataTable tbody').on( 'click', '.dataEdit', function () {
    var data = agentDataTable.row( $(this).parents('tr') ).data();

    $('#agentForm #agentName').val(data.agentName);
    var $select = $('#agentForm #agentType').selectize();
    var control = $select[0].selectize;
    control.clear();
    control.clearOptions();
    control.addOption({text: data.agentType});
    control.setValue(data.areaPincodeId, true);
    });

Но в раскрывающемся списке ничего не отображается.

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

1 Ответ

2 голосов
/ 07 октября 2019

selectize - это плагин для jQuery, предоставляемый на GitHub, насколько я знаю,

В своем вопросе вы не показали метод, в котором вы делаете выбор поля select и, увидев свойЯ полагаю, что вы не написали этот метод должным образом, и в методе вашей таблицы данных отсутствует id: data.agentType.

Я предоставляю вам метод выбора поля select и запроса таблицы данныхчтобы получить его.

Замените приведенный ниже метод в вашем файле jquery для выбора. 

function setAgentTypeSelect() {
    var $agentTypeSelect = $('#agentForm #agentType').selectize({
        selectOnTab: true,
        closeAfterSelect: true,
        persist: true,
        valueField: 'id',
        labelField: 'text',
        options: [],
        preload: true,
        create: false
    }); 
}

А в вашем методе с данными просто замените ваши addOptions control.addOption({id: data.agentType, text: data.agentType});

I 'Я уверен, что, изменив эти вещи, вы получите то, что хотели.

...