使用数据库中的数据进行 JQuery 可编辑选择答案

【问题标题】：JQuery Editable Select with Data From Database使用数据库中的数据进行 JQuery 可编辑选择
【发布时间】：2019-10-24 15:54:53
【问题描述】：

任何人都可以在这种情况下提供帮助，我有一个选择标签，其中数据是使用 Ajax POST 方法从 SQL 数据库加载的。

我的代码如下，但它不能正常工作，但也没有显示任何错误。我正在使用可编辑选择来实现这一点。任何帮助将不胜感激。

链接

        <link rel="stylesheet" href="https:rawgithub.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.css" />
        <script src="https://rawgithub.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.js"></script>

AJAX

     $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        // url: "SerialNumberCapture.aspx/GetAllCompanyDetails",
        url: "ViewSerialNumbers.aspx/ViewGetAllTransactionID",
        data: "{CompanyCode:'" + companycode + "',TransactionType:'" + transype + "'}",
        dataType: "json",
        success: function (data) {
            //$('#ddlViewTransactionType option:not(:first)').remove();

            $("#ddltransactionId").empty().append("<option value='0'>Select</option>");
            //$("#ddltransactionId").empty();
            $.each(data.d, function (key, value) {

                $("#ddltransactionId").append($("<option></option>").val(value.TransId).html(value.TransId));

            });
            $('#ddltransactionId').editableSelect();

          },
        error: function (result) {
            alert("Failed: " + result.status + ": " + result.responseText);
        }
       });

【问题讨论】：

你确定调用了成功回调吗？
是的，如果这一行被注释 $('#ddltransactionId').editableSelect();然后它完美地工作。

标签： javascript jquery jquery-selectors http-post

【解决方案1】：

我认为问题是由 <b> $('#ddltransactionId').editableSelect();</b> 行引起的，您不能在 JavaScript 中以这种方式写入 html 标记。在这里，您应该直接调用$('#ddltransactionId').editableSelect();。

【讨论】：

已删除但仍然相同

【解决方案2】：

对于那些可能遇到此问题的人，我发布了我为解决此问题所做的解决方法。它仅支持 HTML5

                    <input type="text" list="ddltransactionId" id="txtTransactionId" />
                    <datalist id="ddltransactionId">
                        <option value="0">Select</option>
                    </datalist>

谢谢。

【讨论】：

【解决方案3】：

我有同样的问题，你必须怎么做

$.getJSON("http://localhost:34168/api/machine/getall", function (data) {
  $("#modal_machine_name_select").html('');
  $.each(data, function () {
    console.log(data);
    var dt = this;
    
    $('#modal_machine_name_select').editableSelect('add', function () {
      $(this).attr('value', dt.Machine_id);
      $(this).text(dt.Machine_Name);
    });

查看此处的文档 => https://github.com/indrimuska/jquery-editable-select

【讨论】：