从php返回多个值到jquery

时间:2014-09-30 17:03:36

标签: javascript php jquery ajax

我有api,当我输入邮政编码时会返回城市列表和相关的地理区域 例如:

postcode -3000 returns 9 cities and geo zone - A012 
postcode -3008 returns 12 cities and geo zone - C01

所以我写了下面的代码。输入邮政编码后,它会将城市附加到下拉列表中。这很棒

PHP

        if($response == NULL || $response < 1 )
        { 
        echo "wrong Postcode";
        } else{
        foreach ($response as $q)
        {
            $cty =  $q['city'];
            $geozone =  $q['geozone'];
            echo '<option value="'.$cty.'">'.$cty.'</option>';

        }

jquery的

<script type="text/javascript">
$(document).ready(function()
{
$(".postcode").change(function()
{
var dataString = 'postcode='+ id;

$.ajax
({
type: "POST",
url: "load.php",
data: dataString,
cache: false,
success: function(val)
{
        $(".city").html(val);  
}
    });

   });

 });
</script>

问题是我需要将php中返回的$ geozone附加到输入框

因为我已经回显了选项值,所以我可以很容易地附加它

echo '<option value="'.$cty.'">'.$cty.'</option>';

但如何将$geozone = $q['geozone'];返回到我的主页面,以便我可以将其与文本字段一起使用

3 个答案:

答案 0 :(得分:2)

我认为最好从json数据构建select。尝试更改php这样的事情

    if($response == NULL || $response < 1 )
    { 
        echo "wrong Postcode";
    } else{
        echo json_encode($response);
    }

这将返回一个带有城市和地理区域的完整响应的json数组,然后你需要用JS构建表单

$.ajax({
   type: "POST",
   url: "load.php",
   data: dataString,
   cache: false,
   dataType: "json"
   success: function(val)
   {
      options = "";
      for(x in val){
          options += '<option value="'+val[x].city+'">'+val[x].city+'</option>'
      }
      $(".city").html(options);  
      $(".form").append('<input type="text" value="'+val[x].geozone+'">');
   }
});

这将为您构建表单。您必须将此代码调整为json响应,并将.form设置为表单的父选择器。

答案 1 :(得分:0)

我会喜欢这样的 首先让一个数组返回。在索引0处连接选项,索引1在隐藏的ipnut中连接$ geozone(如果这很有用)。

$dataReturn = array();
$dataReturn[0] = '';
$dataReturn[1] = '';

 if($response == NULL || $response < 1 )
        { 
        echo "wrong Postcode";
        } else{
        foreach ($response as $q)
        {
            $cty =  $q['city'];
            $geozone =  $q['geozone'];
            $dataReturn[0] .= '<option value="'.$cty.'">'.$cty.'</option>';
            $dataReturn[1] .= '<input type='hidden' value="'.$geozone.'"';

        }

echo json_encode(array($dataReturn);

json_encode(array($dataReturn)

现在解析成功

success: function(val)
{
        parsed = $.parseJSON(val);
        $(".city").html(val[0][0]);
        $(".hidden").html(val[0][1]);   //a div
}

我没有测试,但我已经做过类似的事了。希望我的记忆有所帮助。

答案 2 :(得分:0)

您可以在选项标签中使用额外属性,如下所示。

echo '<option value="'.$cty.'" geozone="'.$geozone.'" >'.$cty.'</option>';

这将回显为

<option value="Mumbai" geozone="A012" >Mumbai</option>

并使用jquery的.attr()方法从选项

中获取值
var myTag = $(':selected', element).attr("geozone");