Question

我有一个使用php，ajax和tablesorter插件完美生成的表。我现在想将一些输入字段放入下拉框中，以便用户可以选择需要更改的选项。然后，这一切都需要保存到数据库中。以下是我到目前为止的情况：

    $('#getInfo').live('click', function() {
//clear table before search
    $("#inventoryUpdate tbody tr").remove();
    $('#messageInv').html('Please be patient, this might take a minute');
$.ajax({
    type: "POST",
    async: true,
    url: "getInventory.php",
    dataType: "json",
    data: ({skuStart: $("#startSkuRange").val(), skuEnd: $("#endSkuRange").val(), processDate: $("#processDate").val(),
           source: $("#source").val()}),
    success: function(data){
        $('#messageInv').hide(); 
        //console.log(data);
                    var myselectoptions = ''; 
        if(data.isbn2 === null){
                $("#inventoryUpdate").append('<tr><td>No Records Found</td></tr>');
            }else{
        for(var x=0;x<data.isbn2.length;x++)
                {
          $.each(data.defect2[x], function(index, val)
            {
             myselectoptions += '<option value="'+data.defect2[x][index].option+'">'+data.defect2[x][index].option+'</option>';
            });
        $("#inventoryUpdate").append('<tr><td id="tableSKU">'+data.sku[x]+'</td><td id="tableISBN">'+data.isbn2[x]+
                 '</td><td><input type="text" id="tableQuantity" value="'+data.quantity[x]+
                 '"/></td><td><select id="tableDefect">'+myselectoptions+
                 '"</select></td><td><input type="text" id="tableSource" value="'+data.source[x]+
                 '"/></td><td><input type="text" id="tableFeature" value="'+data.feature[x]+
                 '"/></td><td><input type="text"  id="tableLocation" value="'+data.location[x]+
                '"/></td><td><input type="text" id="tableProcessDate" value="'+data.processDate[x]+
                '"/></td><td><input type="text" id="tableBookType" value="'+data.booktype[x]+
                '"/></td><td><input type="text" id="tableCreatedBy" value="'+data.created[x]+
                '"/></td><td><input type="text" id="tableModifiedBy" value="'+data.modified[x]+
                '"/></td></tr>');
                                    }
        $("#inventoryUpdate").trigger("update");
            } // end of else statement
    } // end of success function
});// end of ajax call
}); // end of inventory update function

我希望tableDefect和tableFeature输入成为动态填充的下拉框，默认为数据库中的当前信息。例如，如果来自数据库的缺陷是“撕裂防尘套”，这将是所选择的选项，但我还需要数据库中的其余选项（无缺陷，水损坏等），如果它需要改变。我认为我需要将输入类型更改为选择，但是我该如何填充它呢？这需要再次调用数据库来获取信息吗？这甚至可以用这个插件吗？
编辑：我根据下面的答案粘贴了新的代码，我现在得到19个“选项”（它只是说未定义而不是返回的实际值）第一个记录，38个是第二个等等。我应该只有19个选项。

Answer 1

如果我正确地阅读了您，请将<input type="text"......>替换为 <select id=...><option>...</option></select>

至于动态填充选择，可以通过几种不同的方式处理。使用您的ajax，您可以通过更改现有的

来获取选择值

data.defect[x]进入一个多维对象，所以不是它只是一个字符串，而是输出一个数组，该数组将在你的后端转换为JSON，所以你的对象看起来像

defect[{"option":"value"},{"option":"value"},{"option":"value"},{"option":"value"}]

当您在继承部分构建表时，您将遍历该对象。你基本上会像现在一样做..除了。你的选择看起来像

var myselectoptions = '';
   $.each(data.defect[x], function(index, val)
          {
             myselectoptions += '<option value="'+data.source[x][index].option+'">'+data.source[x][index].option+'</option>';
          });
'"/></td><td><select id="tableDefect">'+myselectoptions+'....

现在这是纯粹的概念，我还没有对它进行测试，而且可能需要进行一些调整才能满足您的需求，但这是您可以通过几种方式处理您想做的事情的核心概念。进入你目前正在做的事情，而不必过多地改变它。

是否有可能在tablesorter插件中有下拉框？

1 个答案: