在AJAX中使用數組jquery

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

Maby這會有幫助嗎？ 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!'); 
     } 


    }); 
} 

data.length在for循環是缺少的東西。

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!'); 
      } 
     }); 
}