使用$.each循环创建多个div，不起作用
我的 php 页面设置如下：
<?php
if(isset($_POST['submit'])){
// Validate results and if correct insert into the DB
// Else add the respective errors
$data[0]['error_1'] = 'Error_1_text';
$data[0]['error_2'] = 'Error_2_text';
/*
.
.
.
*/
$data[0]['error_n'] = 'Error_n_text';
print_r(json_encode($data[0]));
}
?>
这是以下 AJAX 请求发送 POST 请求的位置。如果输入的表单有效，则将其插入数据库，否则如果有任何错误，则所有错误都会附加到数组索引中，$data[0]最后数组是json_encoded, 并print_r()编辑。
<body>
<div class="ssss"></div>
</body>
<script>
$.ajax({
url: "http://localhost/path/to/above/file",
method: "POST",
data: {
submit: 'yes',
form_data_0: 'form_text',
form_data_1: 'form_text',
form_data_2: 'form_text'
},
success: function(data){
// Code to check if errors were present
result = JSON.parse(data);
if (result.hasOwnProperty('0')) {
$.each(result['0'], function(key, error) {
let x = 0;
// Display each error into a modal
$("div#ssss").html('<div id="dmessage_' + x + '" class = "modal" style="display:block"><p id = "pmessage_' + x + '">' + error + '</p></div>');
x++;
});
}
}
});
</script>
AJAX 请求成功后，data为JSON.parse()d 并且该结果被分配给变量result。然后我们检查表单的后处理过程中是否有任何错误。使用if (result.hasOwnProperty('0'))，如果是这样，目的是显示<p>error</p>带有动态 id 的 a 中的每个错误，并包含在<div>带有动态 id 的 a 中。
为了实现这一点，我创建了一个$.each()循环并启动了一个变量x = 0。现在我们遍历$.each()循环的内容，我们打算显示 一个 ，其中<div></div>包含代码中显示的内容以及errorPHP 从后端发送过来的文本以及dmessage_与 的当前值连接的id x。完成后，我们将递增x并再次循环以处理下一个错误。
然而发生的情况是，无论 PHP 发送了多少错误，都只显示 1 个错误框。我通过在语句中添加以下代码来确认这一点if()：
let array = [];
$.each(result['0'], function(key, error) {
// Display each error into a modal
});
array[x] = array.push(error);
console.log(array); // Displays all the errors correctly inside the console
子衿沉夜2回答
-
呼如林
我知道你有解决方案，但我会发布我的答案第一： echo json_encode第四：根本不需要使用，x可以直接使用key第五：可以直接使用dataType: 'json'代替JSON.parse(data)第六：更改.html(为.append(考虑以上所有内容，那么您的代码应该如下所示php<?php if(isset($_POST['submit'])){ // Validate results and if correct insert into the DB // Else add the respective errors $data['error']['error_1'] = 'Error_1_text'; // change all `$data[0]` to `$data['error']` it will be much easier $data['error']['error_2'] = 'Error_2_text'; /* . . . */ $data['error']['error_n'] = 'Error_n_text'; echo(json_encode($data)); // <<<< just $data here }?>JS<body> <div class="ssss"></div></body><script> $.ajax({ url: "http://localhost/path/to/above/file", method: "POST", dataType : 'json', //<<<<< here data: { submit: 'yes', form_data_0: 'form_text', form_data_1: 'form_text', form_data_2: 'form_text' }, success: function(data){ // Code to check if errors were present if (data.error) { //<<<<< here $.each(data.error, function(key, error) { // Display each error into a modal $("div#ssss").append('<div id="dmessage_' + key + '" class = "modal" style="display:block"><p id = "pmessage_' + key + '">' + error + '</p></div>'); }); }else{ $("div#ssss").html(''); } } });</script> -
暮色呼如
这解决了我的问题：<script> $.ajax({ url: "http://localhost/path/to/above/file", method: "POST", data: { submit: 'yes', form_data_0: 'form_text', form_data_1: 'form_text', form_data_2: 'form_text' }, success: function(data){ // Code to check if errors were present result = JSON.parse(data); let x = 0; if (result.hasOwnProperty('0')) { $.each(result['0'], function(key, error) { // Display each error into a modal $("div#ssss").append('<div id="dmessage_' + x + '" class = "modal" style="display:block"><p id = "pmessage_' + x + '">' + error + '</p></div>'); }); } } });</script>
随时随地看视频慕课网APP
PHP