我无法将用户输入的所有值存储在数组中。在窗口警报中，仅显示第一个数组值

Posted 2023-05-08

【中文标题】我无法将用户输入的所有值存储在数组中。在窗口警报中，仅显示第一个数组值

【英文标题】：I can't store all values from user inputs in the array. On window alert only the first array value shows up

【发布时间】：2021-01-09 00:18:41

【问题描述】：

我似乎无法将所有克隆输入保存到一个数组中并通过 $.post() 传递该数组。由于某种原因，它只传递用户选择的第一个数组值。

我愿意

通过 $.Post() 传递数组 如果数组中的所有项目都不存在于 mysql 中，则通过 php 接收 true 或 false。

我被困在只保存原始输入值的数组上。

$(document).ready(function() 
  $("#add").click(function() 
    $("p:last").after($("p:first").clone(true)
                                  .find("#Equi").val("").end()
    );
  );
);

$(document).ready(function() 
  var ar1 = [];
  var input = document.getElementById('#Equi');
  $('#Equi').on('change', function() 
    // $.post('UnitValidate2.php', Unit: ar1, function(data) 
    ar1.push(input.value);
    window.alert(ar1);
    $.post('UnitValidate2.php', Unit: ar1, function(data) 
      window.alert(data);
      if(data == "True") 
        window.alert("Move On");
       else 
        window.alert("Cant call out unit");
        // $("#Equi").val("");
      
    );
  );
);

<!--for clone   -->
<p>
  <label for="lname">Eqiupment:</label>
  <!--<input type="text" id="Name" name="Name">-->
  <input type="text" name="Unit[]" id="Equi" value="" list="namelist4" required/>
  <datalist id="namelist4">
  <select name="Nam" style="display:none">
  <?php
    // Include config file
    require_once "../Login/config.php";
    $conn1 = mysqli_connect($serverName, $userName, $password, $databaseName);
    $sql4 = "SELECT * FROM `Status` WHERE Active = 'Yes' AND Status = 'Ready For Rent' ORDER BY Unit ASC";
    result4 = mysqli_query($conn1,$sql4);
    while ($row4 = mysqli_fetch_array($result4)) 
      echo "<option value='".$row4['Unit']."'>".$row4['Unit']."</option>";
    
  ?>
</option>
</select>
</datalist>

【问题讨论】：

这是 php 吗？你在用 jquery 吗？

我正在使用 jquery。感谢您的回复

欢迎来到 SO。帮助我们帮助您 - 请正确格式化您的代码（缩进）。它使阅读和调试变得更加容易。

【参考方案1】：

我还有很多不清楚的地方。我省略了在 <select> 元素中填写选项的 PHP 部分。我还为您的<datalist> 元素制作了一些元素。还有……

既然你正在使用 jQuery，你不妨正确地使用它：我将你的数据收集部分更改为

var ar1=$('.Equi').get().map(el=>el.value);

我在其中搜索 class=Equi 的所有元素（我必须将其从 id 更改为 class，因为 Id 必须始终是唯一！），然后将它们提取为一个 javascript 数组 (.get())，使用 .map() 获取它们的 .value 属性，并最终将结果数组返回到 ar1。

由于这个 sn-p 在 *** 上运行，我不得不注释掉实际的 $.post() 命令，但 console.log() 显示了将在其中发布的内容。

$(document).ready(function() 
  $("#add").click(function()      
    $("p:last").after($("p:first").clone(true).find(".Equi").val("").end() );
  );
  
  $('.Equi').on('change', function()  
       var ar1=$('.Equi').get().map(el=>el.value);
       console.log("this will be posted:",ar1);
       if (false) $.post('UnitValidate2.php',Unit: ar1, function(data)
         console.log(data);
         if(data == "True") console.log("Move On ");
         else               console.log("Cant call out unit");
       );   

   );
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="add">add</button><br>
<datalist id="namelist4">
  <option value="1">one</option>
  <option value="2">two</option>
  <option value="3">three</option>
  <option value="4">four</option>
</datalist>
<p>
  <label for="lname">Eqiupment
  <input type="text" name="Unit[]" class="Equi" value="" list="namelist4" required/>:</label>
  <select name="Nam">
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    <option value="4">four</option>
  </select>
</p>
<p></p>

【讨论】：

非常感谢，这对您有帮助。我花了 4 天漫长的时间试图让它变得有意义和工作。