选择使用JSON、PHP和MySQL由JavaScript控制和填充的字段

我有一个select字段，目前正在使用一个简单的PHP来填充循环。此字段的目的是使填写表格更容易、更快。允许用户选择选择字段中可用的预设

在字段中选择一个选项时，将激活一个JavaScript函数，该函数将使用与该选项相关联的数据填充表单中的其他字段

JavaScript将执行的示例情况：

请选择选项{非高峰电价、短信套餐、GPRS套餐、定制}

如果用户选择的包不等于“自定义”

然后将值插入字段{语音许可、短信许可、互联网许可、语音邮件许可}

以下是我尝试做的表单截图和说明：

目前，我的选项完全是用PHP填充的，就像这样

//prints out option list for select field    
foreach ($result as $array)
    echo '<option value="'. $array.' ">'. $array. '"</option>';

//打印选择字段的选项列表
foreach（$result作为$array）
回显“”$阵列。”"';

目前这一切都很好，但我刚刚意识到，在表单开发的后期阶段，我会让我的生活变得困难，因为我将使用Javascript来管理该字段，所以用Javascript完成整个字段是有意义的

这意味着JavaScript将：

• 从JSON加载数据，其中包含select字段的数据以及将在其他字段中显示的相关数据
• 使用JSON中的数据填充选择字段
• 监视onchange的字段
• 效果表单中的其他字段

由于这对我来说是一个全新的领域，我希望你们能为我指明正确的方向：

• 以最好的方式将数据传递给JavaScript，我是否有单独的数组（一个用于下拉，另一个用于其他字段值），还是一个对象更好地存储所有内容并通过JSON传递
• 如何处理从PHP传递到JavaScript的数据？在JavaScript中是否有处理数组的等效项
• 我应该在PHP端完成所有准备工作，还是让JavaScript只处理原始数据

任何代码或类似项目的示例都非常受欢迎！：）

你可能会告诉我，我脑子里有一个想法，我想如何实现这一目标，但我不知道这是否是最好的方法

---

谢谢您的时间

好的，假设您使用jQuery，我会怎么做

考虑到预设下拉列表已经填充（我认为没有问题）

客户端（JS）：

还可以使用each（）在JS中循环返回的数组（参见jQuery文档）

在PHP端（ajax.PHP）：

---

你可以大大扩展这一点，但是有了这些信息，你应该能够让基础工作起来

在PHP中创建

选项会让你的生活变得困难的部分，你失去了我。到底是什么让你这么想的呢？如果我要用PHP和Javascript将东西传递到表单中，它可能会我觉得有点乱。所以我觉得通过JS来做会更整洁？@Pointy我添加了一个截图m如果这对Hanks有帮助的话，即使这是在jQuery中，它给了我一个解决这个问题的好主意！谢谢你来到这里给我提建议！：）你也可以用简单的JS来做，但这会使它更复杂，so我真的建议您使用方便的框架：）

//On page load
$().ready(function() {  
    //Onchange event for the dropdown
     $('#presetDropdown').change(function(){
        //Get the dropdown value
        var preset = $(this).val();
         //Make the AJAX request
         $.ajax({  
                        type: "POST", 
                        //Ajax php file here:
                        url: 'ajax.php', 
                        dataType: 'json', 
                        //Which data to send:
                        data: "req=getPreset&preset="+preset , 
                        //Oncomplete
                        complete: function(data){

                             try{
                                var result = JSON.parse(data.responseText);
                                //Populate the fields with the returned data
                                 $('#field1').html(result[0]);
                                 $('#field2').html(result[1]);
                                 $('#field3').html(result[2]);
                               }catch(err){
                                  alert(err.message);
                               }


                  }
            }); 
     });

});

switch ($_POST['req'])
{
    case 'getPreset':
        //Get preset here en stuff into array:
        $aReturnArray = array($sValForField1,$sValForField2,$sValForField3);
    break;

}
//JSON encode the return array
echo json_encode($aReturnArray);