从表中保存多个下拉选择 - PHP MySQL

Posted 2023-05-07

【中文标题】从表中保存多个下拉选择 - PHP MySQL

【英文标题】：Save Multiple Dropdowns Selections from a Table - PHP MySQL

【发布时间】：2017-02-22 09:33:52

【问题描述】：

我有一个带有下拉选择列的表格。如何将 Save Button Click 上的选定选项保存到我的数据库。

我尝试了以下方法，但似乎无法将任何数据放入数组：

表格展示

表格中的下拉菜单：

<td  nowrap> 

<select class="bs-select form-control" name="providers[]"     id="serviceProviders" data-id="<?php echo $row["provider_id"]; ?>" id="serviceProvider" data-live-search="true" data-size="8">    
</select>

javascript 部分

$(document).on('click', '#saveChanges', function(e)

            var id = []; 

            $('serviceProviders').each(function(i)  

                 id[i] = $(this).val();  

                   console.log('Service Provider Values are  = ' + id[i]);
            );  
            if(id.length === 0) //tell you if the array is empty  
              
                 alert("Please Select at least one transaction");  
              
            else  
              
                 $.ajax(  
                      url:'some_php_scrip_to_save_the_data.php',  
                      method:'POST',  
                      data:id:id,  
                      success:function()  
                        
                           for(var i=0; i<id.length; i++)  
                             
                               // $('tr#'+id[i]+'').css('background-color', '#ccc');  
                               // $('tr#'+id[i]+'').fadeOut('slow');  

                               window.location.reload(true); 

                             
                        
                 );  
              


  );  

【问题讨论】：

您应该为此尝试多选。

我该怎么做？

ID 在 html 文档中必须是唯一的，您不能在多个元素上使用相同的 id。而$('serviceProviders') 将选择具有 标签名称 serviceProviders 的元素，其中没有。

试试这个 " data-live-search="true" data-size="8" multiple>。并且不要在一个标签中多次使用 id=""。

好的。如果我区分 Id.. 然后我如何将不同的值放入一个数组中，因为 Droppdowns 是自动生成的，并且每次页面加载时都可以有不同的 Id.. 我如何在我的 JavaScript 中满足这一点？

【参考方案1】：

元素的 ID 属性必须是唯一的。 $('serviceProviders') 应该只返回一个选择元素。尝试将列号添加到 id 后缀以使其唯一。

var id = []
for (var i = 1; i <= MaxColNo; i++) 
  var e = document.getElementById("serviceprovider" + i);
  var text = e.options[e.selectedIndex].text;
  id[i] = text;

并在 ajax 调用中用引号包围属性名称 - data :'id':id