Rizwan Ali Ответов: 1

Выпадающий список не работает в отзывчивом jquery datatable

<pre><pre>I have dropdown column in jquery datatable.

var ddl = $('#ddlTest');
ddl.append($("<option></option>").val('0').html('Selectvalue'));


When I try to add options to dropdown using jquery, no effect on dropdown.


Проверьте эту скрипку : jQuery Datatables отзывчивый пример - JSFiddle[^]

Что я уже пробовал:

When I try to add options to dropdown using jquery, no effect on dropdown

ZurdoDev

Я вижу пару проблем. Вы никогда не устанавливаете событие onclick кнопки. Так что он ничего не вызовет. Во-вторых, вы определяете AddOption внутри вашего готового документа. Вы захотите, чтобы он был готов за пределами документа, чтобы он всегда был там.

1 Ответов

Рейтинг:
2

F-ES Sitecore

Установите "тип нагрузки" для вашего js на "No wrap - bottom of body". Вы установили его в положение on load, так что ваш js оборачивается в функцию, которая все усложняет.

Переместите функцию AddOption за пределы события dom ready

$(document).ready(function() {
    $('#example').DataTable( {
        responsive: true
    } );
} );

function AddOption()
{
 var ddl = $('#ddlTest');
 ddl.append($("<option></option>").val('0').html('Selectvalue'));
}


Наконец, в вашем коде нет ничего, что заставляет кнопку вызывать вашу функцию, поэтому добавьте и это.

$(document).ready(function() {
    $('#example').DataTable( {
        responsive: true
    } );
    
    $('#btn1').click(function() { AddOption(); } );
} );

function AddOption()
{
 var ddl = $('#ddlTest');
 ddl.append($("<option></option>").val('0').html('Selectvalue'));
}


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