通过 Ajax Jquery 填充选择列表菜单

Question

在有人说这是这个和那个问题的重复之前，让我向你保证，我已经尝试了那里的解决方案，但我失败了。我正在使用this 网站上提供的解决方案来提出我的解决方案，我相信我已经完成了 90%，除了一个错误。我想显示具有与其关联的某个公共 ID 的所有代码的列表。

这是我用来获取代码列表的 PHP 代码

<?php
$budgetcode=$_POST['budgetcode'];
//$budgetcode=2102;

$selectcodes="SELECT * FROM tblbudget_codes WHERE T1 = $budgetcode";
$query=$connection->query($selectcodes);
$count=$query->num_rows;
if($count < 1)
{
    die('0');
}
else{
    while($row=$query->fetch_array()){

        $T1=($row['T1']);
        $T2=($row['T2']);
        $T3=($row['T3']);
        $T4=($row['T4']);
        $optionValue = $T1."-".$T2."-".$T3."-".$T4;
            echo json_encode("<option>$optionValue</option");            
        // echo json_encode('1');
        }

    }
 ?>

这是我用来获取代码的 ajax 调用

$.post("Functions/getbudgetcodes.php",{budgetcode:budgetid},function(data){
    if(data!='0')
       { 
       $("#budgetcode").html(data).show();
       $("#result").html('');
        }   
        else{
             $("#result").html('<em>No codes found. Contact Administrator</em>');
            }
        },'json')
    //alert(budgetid);

    })

这里的问题是如果不是数字，jquery 不理解它正在接收的数据。例如，如果我注释掉 json_encode('1') 并在我的成功部分放置随机 html 代码而不是数据，我会在浏览器中显示结果。谁能告诉我为什么 jquery 只识别从 PHP 回显的数值而不是 varchar 值。使用 jquery 1.4.2。任何帮助表示赞赏。

编辑
我已经达到了一定程度，现在我被卡住了。我用过约翰的答案，这是我的 jquery 代码。我只需要拆分数组并将每个元素一次附加到一个变量，例如here

这里是代码。有人请告诉我如何拆分（数据）。我可以提醒它，但它是逗号分隔的。只需要将各个项目附加到变量 html 中，然后显示即可。

$.post("Functions/getbudgetcodes.php",{budgetcode:budgetid},function(data){
     if(!$.isEmptyObject(data))
       { 
       //alert (data);
      // alert(split (data))
     var html = '';
    var len = data.length;
    for (var i = 0; i< len; i++) {
        html += '<option>' +data+ '</option>';
    }
       $("#budgetcode").html(html).show();
       $("#result").html('');
        }   
        else{
             $("#result").html('<em>No codes found. Contact Administrator</em>');
            }
        },'json')

Answer 1

我会完全跳过 JSON：

PHP

echo "<option>$optionValue</option>";

其他一切都应该工作。

Answer 2

终于明白了。这是php代码

$selectcodes="SELECT * FROM tblbudget_codes WHERE T1 = $budgetcode";
$query=$connection->query($selectcodes);
$count=$query->num_rows;
if($count < 1)
{
    die('0');
}
else{
    while($row=$query->fetch_array()){
        $data[] = $row;

                }   
    echo json_encode($data);        
    }
 ?> 

这里是jquery代码

$.post("Functions/getbudgetcodes.php",{budgetcode:budgetid},function(data){
     if(!$.isEmptyObject(data))
       { 
       //alert (data);

     var html = '';
     var joiner='';
    var len = data.length;
    for (var i = 0; i< len; i++) {
        joiner=([data[i].T1,data[i].T2,data[i].T3, data[i].T4].join('-'));
        //alert(joiner);
        html += '<option>'+joiner+'</option>';
    }
       $("#budgetcode").html(html).show();
       $("#result").html('');
        }   
        else{
             $("#result").html('<em>No codes found. Contact Administrator</em>');
            }
        },'json')

必须使用连接来使用破折号连接多个代码。希望这可以帮助。 PHP 部分和 jquery 部分的灵感来自this question

Answer 3

FWIW，为了填充选择列表，我通常使用以下 jQuery 代码：

// 从作为对象给出的项目数组中填充选择列表：{ 名称：'文本'，值：'值'} 函数populateSelectList（父，项目）{ parent.options.length = 0;

    if (parent.options.length === 0) {
        parent.options[0] = new Option("Please select something...", "");
    }

    $.each(items, function (i) {
        if (typeof (this) == 'undefined') { return; }
        parent.options[el.options.length] = new Option(this.name, this.value);
    });
}

为了调用上述函数，我使用 map 方法传递 ajax 调用的结果，其中 #select 是父选择元素的选择器。我将 Text 属性设置为名称，将 Value 设置为值，但这应该根据 ajax 调用返回的对象而改变（例如，假设返回的对象具有 Value 和 Text 属性）。

populateSelectList($('#select').get(0), $.map(results, function (result) { return { name: result.Text, value: result.Value} }));