从ajax / javascript调用获取数据并填充所选插件多选

时间:2013-12-14 14:34:36

标签: javascript php ajax jquery-chosen

我搜遍了这件事,找不到任何资源来帮助我。如果我重新提出这个问题,我会事先提出异议。

我需要做的是echo通过休息控制器从ajax / javascript调用中获取的json对象的数据。这些php和ajax调用都在同一页面中我只是无法找到解决此问题的工作。以下是我想要回显数据的区域,

<div>
    <em>Tags</em>
    <select data-placeholder="Tag your question here" style="width:350px;" multiple class="chosen-select" tabindex="8">
        <option value=""></option>
        <?php 
            foreach($jsonObj as $obj){
                echo "<option>".$obj->tagName."</option></br>";
            }
        ?>
    </select>
</div> 

以下是同一页面中的javascript / ajax调用

<script type="text/javascript" lang="javascript">
    function doGetTag() {
        alert('here');     

        $.ajax({
            url: 'index.php/rest/resource/qtag',
            //data: data,               
            success: function(data) {
                var jsonObj = JSON.parse(data);                    
            },
            type: "get"     
        });
 }   
</script>

我的要求是在php代码段中分配$jsonObj,其中var tagObj的内容位于同一页面的javascript片段中,或者将ajax JSON响应转换为html代码{{ 1}}格式。非常感谢您的专家建议。

再次感谢:)

1 个答案:

答案 0 :(得分:0)

您可以使用JavaScript本身更新内容,因为您通过AJAX获得响应。

EG。

<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
function doGetTag() {

    $.ajax({
            url: 'json_data.php',
            //data: data,               
            success: function(data) {
                alert(data);
                var jsonObj = JSON.parse(data);
                $('.chosen-select').html('<option value=""></option>');

                $.each(jsonObj, function (key, value) {
                    var opt = '<option>'+value+'</option>';
                    $('.chosen-select').append(opt);
                });             
            },
            type: "get"     
        });
}
</script>
</head>
<body>
<div>
<?php

$jsonObj=array('0' => "Mercedes", '1' => "Ferrari", '2' => "Volkswagen");

?>

    <em>Tags</em>
    <select data-placeholder="Tag your question here" style="width:350px;" multiple class="chosen-select" tabindex="8">
        <option value=""></option>
        <?php 
            foreach($jsonObj as $key=>$value){

                echo "<option>".$value."</option></br>";
            }
        ?>
    </select>
    <p><a href="javascript:void(0)" onClick="doGetTag();">doGetTag</a></p>
</div> 
</body>
</html>

json_data.php(示例!)

<?php
echo '{"3":"Mercedes-New","4":"Ferrari-New","c":"Volkswagen-New"}';
?>