我遇到的问题是我的php生成的select / option列表不适用于我所有动态生成的块/容器。它只是将PHP select添加到最后一个容器/块实例,尽管为每个容器调用它。在使用警报进行故障排除时,似乎在添加容器/块并生成选择之前会运行所有迭代,因此它始终只显示在最后一个 -
n = -1
function addDiv() {
n++;
因此,简要概述 - 在页面初始化代码将获得在特定条件下数据库中有多少条目,并将该数字应用于'length',然后多次运行addDiv()函数。通常,当通过按钮一次添加一个块时,它将使用addDiv()函数中的选项/选项列表通过php填充创建的块,但是当使用循环(initialize()函数)自动执行此操作时,上面问题发生了。
$( document ).ready(function() {
initialize();
});
function initialize() {
$.ajax({
url: 'get-entries.php',
type: 'POST',
dataType: 'text',
cache: false,
success: function(data) {
result = data;
var arrayJson = JSON.parse(data);
console.log(arrayJson);
length = arrayJson.length;
console.log(length);
for(var i = 0; i < length; i++) {
addDiv();
};
},
error: function(jqXHR) {
alert("Error while fetching data");
console.log("Error while fetching data: " + jqXHR.status + " " + jqXHR.statusText + " " + jqXHR.responseText); //improved error logging
}
});
};
这里是与addDiv相关的代码,其中包含一些redaction,以便于阅读。
var n = -1;
function addDiv() {
n++;
$.post(
"json-option-generator.php",
{}
).done(
function(data)
{
$('#selectedcoin' + n).html(data);
});
$("<div class='coinmarketcap fill' id='container"
+ n +
"'><form id='"
+ n +
"' name='"
+ n +
"' class='formClass' method='post' action=''><select onchange='mySelect(this)' type='text' class='coinname' id='selectedcoin"
+ n +
"' name='selectedcoin"
+ n +
//.etc.....
"' autocomplete='off' value=''><select></select>").appendTo(".main-container");
}
最后是PHP文件的内容,用于根据json数据生成选项列表 -
<?php
$json = file_get_contents("../ticker/full.json");
$decode = json_decode($json, true);
sort($decode);
echo '<select name="coinname">';
foreach($decode as $a){
echo "<option value='{$a['id']}'>{$a['name']}</option>";
}
echo '</select>';
?>
我知道这很麻烦,可能需要深入阅读,所以我很感激任何人花时间去看。
有什么明显可以帮助推动我朝着正确的方向发展吗?我尝试通过使用setTimeout函数包装'addDiv()'来破坏initialize()中的'addDiv()'调用,但没有快乐。
答案 0 :(得分:1)
它应该适用于此(我为理解命名的参数不同,但index_t
和n
都可以命名为var n = -1;
function sendToGenerator(index){
var index_t = index;
$.post(
"json-option-generator.php",
{}
).done(
function(data)
{
$('#selectedcoin' + index_t).html(data);
}
);
}
function addDiv() {
n++;
sendToGenerator(n);
$("<div class='coinmarketcap fill' id='container"
+ n +
"'><form id='"
+ n +
"' name='"
+ n +
"' class='formClass' method='post' action=''><select onchange='mySelect(this)' type='text' class='coinname' id='selectedcoin"
+ n +
"' name='selectedcoin"
+ n +
//.etc.....
"' autocomplete='off' value=''><select></select>").appendTo(".main-container");
}
):
{{1}}