PHP jQuery 数据属性填充下拉列表

Question

我有一个 HREF，其中包含来自 PHP 查询并加载到 table 中的各种数据属性（大约 8 个）。当您单击该按钮时，它会通过 jQuery 获取数据属性并将它们发送到模式 window，我可以在其中以表单形式使用它们。

我可以打开 window 并将属性放入 INPUT 字段中，没有问题。

我想做的是将属性放在 SELECT 下拉列表的第一个选项中。

这是具有以下属性的按钮：

 <tr><td><a href='' class='modAccount' 
    data-modcode=".$row[partner_code]." 
    data-modname=\"".$row[partner_name]."\" 
    data-boiler=\"".$row[boilerplate]."\" 
    data-surcharges=\"".$row[no_new_surcharges]."\" 
    data-ccalog=\"".$row[cca_logistics]."\"  
    data-toggle='modal'>Click</a></td></tr>

我有很多数据属性。我不得不为这个问题删除一些。

这里是 jQuery 用于检索数据属性并将它们发送到模态 window，称为 modifyModal。

这里是 jQuery:

 $(function()
 {
   $('.modAccount').click(function(e)
   {
     e.preventDefault();
     $partnerCode = $(this).attr('data-modcode');
     $partnerName = $(this).attr('data-modname');
     $boiler = $(this).attr('data-boiler');
     $surcharges = $(this).attr('data-surcharges');
     $ccalog = $(this).attr('data-ccalog');
       // the 5 below currently populate the INPUT fields for the ID's listed
     $('#modpartnerCode').val($partnerCode);  
     $('#modpartnerName').val($partnerName);
     $('#modplatform').val($platform);  // <- should go to dropdown
     $('#modboiler').val($boiler);  // <- should go to dropdown
     $('#modsurcharges').val($surcharges);  // <- should go to dropdown
   });
 });    
 $(document).on("click", ".modAccount", function () 
 {
   $('#modifyModal').modal('show');
 });

您可能已经在上面的注释中读到，我可以将属性及其各自的 ID 发送到 INPUT 字段。

我需要能够填充下拉菜单 SELECT 字段的第一个选项。

我认为我不需要显示 MODAL window 代码。如前所述，我可以使用我列出的 ID 填充 INPUT 字段。

如何获取 ID 以填充下拉列表 SELECT 第一个 OPTION 值？

模态代码如下：

 <div class="modal fade" id="modifyModal" aria-hidden="true">
 <div class="modal-dialog">
 <div class="modal-content">
 <div class="modal-header">
 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
 </div>
 <div class="modal-body">
 <form role="form" action="api/modifyAcct.php" method="get" id="modAcctForm" name="modAcctForm">
 <input readonly type="text" class="form-control" id="modpartnerName" name="modpartnerName" />
 <input readonly type="text" class="form-control" id="modpartnerCode" name="modpartnerCode" />
 <select class="form-control" id="modboiler" name="modboiler" />
   <option value=""></option> // <- #modboiler goes here
   <option value="Y">Yes</option>
   <option value="N">No<option>
 </select>
 <select class="form-control" id="modsurcharges" name="modsurcharges" />
   <option value=""></option> // <- #modsurcharges goes here
   <option value="Y">Yes</option>
   <option value="N">No</option>
 </select>
 <select class="form-control" id="modplatform" name="modplatform" />
   <option value=""></option> // <- #modplatform goes here
   <option value="Y"></option>
   <option value="N"></option>
 </select>
 </div>
 </div>
 </div>
 </div>

Answer 1

使用jquery到select第一个选项并设置值。

$('#modplatform option:first').val($platform);
$('#modboiler option:first').val($boiler);
$('#modsurcharges option:first').val($surcharges);

PHP jQuery 数据属性填充下拉列表

PHP jQuery Data-Attribute populate dropdown

php

jquery

modal-dialog

custom-data-attribute