Question

我正在尝试使用List.js创建一个过滤器，在我的表中搜索已经填充了JQuery。

实施例：下面的所有“项目”都填充了JQuery。当我开始搜索List.js时，删除与输入不匹配的数据。但是当我清除searchinput时，数据没有回来，因为它已被删除。

是否有“保存”数据？

三江源..

HTML

  <div class="col-md-2">
        <div class="panel-title">Make<span class="pull-right"><i class="fa fa-sort"></i></span>
        </div>

        <div id="makes">
            <div class="form-group has-feedback" style="margin-top: 5px;">
                <input type="text" class="form-control search input-sm" placeholder="make"/>
                <span class="glyphicon glyphicon-search form-control-feedback"></span>
            </div>
            <div style="border: 1px solid #ccc; border-radius: 3px; height: 100%;" class="pre-scrollable">
                <table class="table-no-borders" id="make">
                    <!-- IMPORTANT, class="list" have to be at tbody -->
                    <tbody class="list" id="make-table-body">

                    </tbody>
                </table>
            </div>
        </div>
    </div>

的Javascript

var makeOptions = {valueNames: ['make']};
var makeList = new List('makes', makeOptions);



$('.clickable-table-row').on('click', function () {
    var id = $(this).data('vehicle-id');
    $('#make-table-body').empty();
    $.get('/api/get/makes/by' + '/' + id, function (data) {
        $.each(data, function (i, object) {
            var tr = createTableRow('make-id', object.id);
            var td = createTableData('make', object.name);
            $('#make-table-body').append(tr.append(td));
        });
    });
});

function createTableRow(data_attribute, attribute_value) {
    return $('<tr></tr>').addClass('clickable-table-row').attr("data-" + data_attribute, attribute_value);
}

function createTableData(className, value) {
    return $('<td></td>').addClass(className).text(value);
}

Answer 1

解决方案是在动态加载完成后创建一个新列表。

请参阅：https://jsfiddle.net/aqszp8qa/4/

  makeList = new List('makes', makeOptions); // solved the problem

List.js删除搜索中的JQuery数据

1 个答案: