Question

<input type="text" name="b_destinations[]" id="title"/>
<input type="text" name="b_destinations[]" id="title"/>
<input type="text" name="b_destinations[]" id="title"/>
<input type="text" name="b_destinations[]" id="title"/>

以上是我的代码，您可以看到我有多个具有相同名称和ID的文本框。现在我正在使用没有ajax函数的php进行提交。使用foreach和json_encode，因为这是针对旅行预订计划的，所以我将这些值保存在单个数据库列中。以下是我正在使用的查询的php代码。

foreach($_POST['b_destinations'] as $p_destination) {
    $pdata[] = mysqli_real_escape_string($mysqli,$p_destination);
}
$pData[] = $pdata;
$b_destinations = json_encode($pData);

我保存的表单没有ajax，但是现在我要使用ajax提交表单。如何将具有相同名称和ID的多个文本框值传递给ajax数据字符串，然后将其发布到我的php查询中

Answer 1

Id无关紧要。您可以使用给定名称传递多个值，

var b_destinations = document.getElementsByName('b_destinations[]');
var b_destinationsArr= [];
for(var i=0;i<b_destinations.length;i++)
    b_destinationsArr[] = b_destinations[i].value;
 // Ajax call with b_destinationsArr array in POST action

Answer 2

正如上面的评论，我真的建议不要为元素DOM使用相同的ID，它必须是唯一的。

这是上面帖子的解决方案：

const handleClick = () => {
    var b_destinations = document.getElementsByName('b_destinations[]');
    var b_destinationsArr= [];

    b_destinations.forEach(function(element) {
        console.log(element.value);
        b_destinationsArr.push(element.value);
    });

    var data = JSON.stringify(b_destinationsArr);
    
    //you have to change the url data here
    var url = "https://your.url.here";

    $.ajax({
        type: "POST",
        url: url,
        data: data,
        success: success,
        dataType: dataType
    });
    //the same above
    //$.post( url, data );

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="#" onSubmit="return handleClick()">
    <input type="text" name="b_destinations[]" id="title"/>
    <input type="text" name="b_destinations[]" id="title"/>
    <input type="text" name="b_destinations[]" id="title"/>
    <input type="text" name="b_destinations[]" id="title"/>
    <input type="submit" value="Submit">
</form>

如何将具有相同ID和名称的多个文本框值传递给Ajax查询字符串

2 个答案: