如何使用多个选择选项值更新数据库：Wordpress

Question

我有一个包含多个项目且具有状态列的自定义表。我使用select创建了一个下拉列表以更改状态。

这里，我想要做的是，在更改状态选择选项时，应该在db中更新该特定行的状态值。 我能够使用jquery获取select的值，但我不确定如何在一起选择多个下拉列表时更新表。

我有以下选择选项，

  <select id ="update-statusDropDown">
  <option name="waiting" value="waiting">Waiting</option>
  <option name="due" value="due">Due Diligence</option>
  <option name="escrow" value="escrow">Escrow</option>
  <option name="inspection" value="inspection">Inspection</option>
  <option name="closed" value="closed">Closed</option>
</select>

我的jQuery就像下面这样，

jQuery(document).ready(function () {

    jQuery('select#update-statusDropDown').change(function () {

        //Selected value
        var inputValue = $(this).val();
        alert("value in js " + inputValue);

        //Ajax for calling php function
        jQuery.post('update-listing-status.php', {dropdownValue: inputValue}, function (data) {
            alert('ajax completed. Response:  ' + data);
            //do after submission operation in DOM
        });
    });
});

我想根据＆quot; inputValue＆＃39;更新表格中的状态值。从下拉列表。此外，如果同时选择多个下拉列表，如何一起更新所有值。 请任何人帮忙吗？

附上我当前表格的屏幕截图。

Answer 1

您已使用该下拉列表的ID注册了select的更改事件，这意味着只有具有该ID的下拉列表才会触发您通过jquery.post发出的请求

改为使用select属性的class属性并在该类上注册change事件

现在要获取唯一元素，您可以使用该select元素和选项的data属性，例如data-tableid =“something”

在这种情况下，您可以注册所有选择元素的所有更改事件，并且能够提取仅对给定表或列名称唯一的值。

$('.class-name').on( 'change' , function(){

  // Get the Select itself
  var me = $(this);
  var tableid = me.data('tableid');
  var something = $(this).find(':selected').data('something');

  console.log( tableid );
  console.log( something );

} );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="class-name" data-tableid="table-id">
  <option value="the value" data-something="some value 2">The Title 2 </option>
    <option value="the value" data-something="some value">The Title</option>
</select>

现在，由于您可以唯一地识别正在使用哪个选项以及正在使用哪个选项，因此您可以根据需要发出请求。