动态地将Select2添加到表单

Question

当我点击添加按钮时：

   emptyColumn.innerHTML = 
   '<td><a class="cut btn-mini">-</a>  <td><input type="hidden" class="chosen1"></td></td>' +
   '<td><input name="quantity" type="text" value="0"></td>' +
   '<td><input name="price" type="text" value="0"></td>' +
   '<td><input name="total" type="text" value="0" readonly></td>';

我正在尝试将Select2插件附加到隐藏输入

$(document).ready(function(){
    $(".add").click(function () {
    document.querySelector('table#inventory tbody').appendChild(generateTableRow()
    $(".chosen1").select2();
}); });

但没有任何反应。

错误

uncaught exception: query function not defined for Select2 s2id_autogen1

Answer 1

//attach select2
function attachSelect2(row){
row.find('input[name^="product[]"]').select2({
    minimumInputLength: 1,
    quietMillis: 10,
    allowClear : true,
    width: 120,
    ajax: {
        url: 'getProd.php',
        dataType: 'json',
        data: function (term, page) {
            return {
                q: term, // search term
                page_limit: 1,
                page: page
            };
        },
        results: function (data,page) {
            return {results: data};
        }
        },
        id: function(object) {
            return object.text;
        },
        error: function(){
            alert('error');
        }
    });

}