Question

在json-encode（）;

的AJAX jquery函数中使用数组

嗨，我是AJAX的新手

我有非页面，我想调用ajax请求在此页面上添加内容。 export.php

<div class="row">
    <div class="span12">
        <select id="listTable" name="listTable">
            <option value="appel">Appels</option>
            <option value="dossier">Dossiers</option>
            <option value="commande">Commandes Fournisseur</option>
         </select>
    </div>
</div>

<div class="row">
    <div class="span12">
         <button class="btn btn-primary" onClick="selectTable()">Select</button>
    </div>
</div>

<div id ="columns" class="row" style="display:none;">
    <div class="span12">
         <div id="columns-check" style="">
            <!-- Here will be displayed the content of the ajax request-->
         </div>
    </div>
</div>

<script type="text/javascript" src="_module/ExportFichier/exportFile/ajax/requestExport.js"></script>

这是我的ajax功能

function selectTable(table){

    var table = $("#listTable").val();

        $.ajax({

            url: "_module/ExportFichier/exportFile/ajax/requestColumns.php",
            type: "POST",
            data: "table="+table,
            dataType: 'json',

            success: function(data){

                $('#columns').css('display','block');
                $('#columns-check').empty();

                for(i=0; i<data; i++){
                    $('#columns-check').prepend('<div>I would like to display here the content of my array</div>');
                }
            },

            error: function(){
                alert('The Ajax request did not works!');
            }


        });

}

requestColumns.php

header("content-type: application/json; charset=utf-8");

require_once '../requirements.php';

$tableName = $_POST["table"];

$objService = new ExportFileService($tableName);
$columns = $objService->get_columns();

echo json_encode($columns);

我没有得到我可以将requestColumns.php文件中的数组返回到我的jquery Ajax请求的方式，并且在使用它来修改我的页面export.php的DOM之后。谢谢你的帮助。

Answer 1

也许这会有所帮助？ jQuery JSON

它会变成这样：

for (var i in data.<YOUR_KEY>) {
     $('#columns-check').prepend('Line: ' + data.<YOUR_KEY>[i]);
}

Answer 2

function selectTable(table){

var table = $("#listTable").val();

    $.ajax({

        url: "_module/ExportFichier/exportFile/ajax/requestColumns.php",
        type: "POST",
        data: "table="+table,
        dataType: 'json',

        success: function(data){

            $('#columns').css('display','block');
            $('#columns-check').empty();

            for(i=0; i<data.length; i++){
                $('#columns-check').prepend('<div>' + data.arraykey + '</div>'); //change arraykey with your index name
            }
        },

        error: function(){
            alert('The Ajax request did not works!');
        }


    });
}

for循环中的

data.length是缺失的东西。

Answer 3

您可以尝试根据需要更改我的代码。但一般的想法是这样的：

//Your php code

   //Retrieiving data from AJAX
   $selctValue = $_POST["table"];

    //Send data from php to javascript. Using JSON you can send what you want.
    $arrToJSON = array(
        "dataPHPtoJs"=>"yourData",
        "asYouWant"=>"<div class=\".class1\">soemting</div>"    
    );  
    echo json_encode(array($arrToJSON));


    //Your javascript function
    function selectTable(){



    //Data you want to send to php. As many as you want.....
    var dt={ 
              table:$("#listTable").val()
            };



    var request =$.ajax({//http://api.jquery.com/jQuery.ajax/
                            url: "_module/ExportFichier/exportFile/ajax/requestColumns.php",
                            type: "POST",
                            data: dt,
                            dataType: "json"
                        });     



        //Ajax Done catch JSON from PHP 
        request.done(function(dataset){

            //Retrieiving information from php using JSON. Note, you can create html objects here as you did, or if you want your project more dinamicaly you can send html code from php (as I do)

            for (var index in dataset){ 
                 dataPHPtoJsJS=dataset[index].dataPHPtoJs;
                 asManyasYouWantJS=dataset[index].asYouWant;

                 $('#columns-check').prepend('<div>asManyasYouWantJS</div>');

             }

             //JavaScript conditions. Here you can control the behaivior of your html object, based on your PHP response
             if(dataPHPtoJsJS test your condition){
                //Do what you want to do..... 
                $('#columns').css('display','block');
                $('#columns-check').empty();
             }

        });     

  }

Answer 4

谢谢大家的回答。它帮助我这样做。这是我的代码：

function selectAllColumns(){

    var table = $("#listTable").val();

        $.ajax({

            url: "_module/ExportFichier/exportFile/ajax/requestAllColumns.php",
            type: "POST",
            data: "table="+ table,
            dataType: 'json',

            success: function(data){
                console.log('The Ajax request WORKS!');

                $('#columns').css('display','block');
                $('#columns-check').empty();

                for (var key in data) {
                    if (data.hasOwnProperty(key)) {
                        var id = Math.random();
                        $('#columns-check').prepend('<div style="display: inline-block; margin: 20px 20px 20px 0;"><input type="checkbox" id="'+id+'" class="field" value="'+data[key]+'" style="display: inline-block; margin:0 5px -1px 0;"><label for="'+id+'" class="field" style="display: inline-block;">'+data[key]+'</label></div>');
                    }
                }
            },

            error: function(){
                console.log('The Ajax request did not works!');
            }
        });
}

在AJAX jquery中使用数组

4 个答案: