Populate ionic list from database

[madson_g_]

How do I populate my ionic list with thumbnail dynamically? The code below brings me the data from my db successfully but I am having some issues appending each value to each list item. item.nome and item.dia shows me "undefined" values;

$(document).on("click", "#submit", function(evt)
    {
        /* your code goes here */
  var state = $("#state").val();
  var city = $("#city").val();
  var dataString = "state="+state+"&city="+city+"&submit=";
  var $server;
  $server = 'http://localhost/project';
                  
                   function Lista(){
                           $.ajax({

                               type: "post",
                               url: $server+"/check.php",
                               data: dataString,
                               success: function(data) {
           
           var data = $.parseJSON(data);
           
           var estado = data[0];
           var cidade = data[1];
           var nome = data[2];
           var local = data[3];
           var dia = data[4];
           var horario = data[5];
           
           //alert(nome);
           activate_page("#list");
           
          $.each(data, function(index, item){
            var list_item = '<ion-item class="item widget uib_w_14 d-margins item-thumbnail-left" data-uib="ionic/list_item_avatar" data-ver="0">';
            list_item += '<img src="images/Strabburg.jpg" id="thumb">';
            list_item += '<h2>'+item.nome+'</h2>';
            list_item += '<p>'+item.dia+'</p>';
            list_item += '</ion-item>';
            
            $("#lista").append(list_item);
           });          }
         });
         }

         new Lista();
    });

check.php

if(isset($_POST['submit'])){
 
  $estado = $_POST['state'];
  $cidade = $_POST['city'];
  
  $sql = "SELECT * FROM table WHERE state = '".$estado."' and city = '".$cidade."' ";
  $result = mysqli_query($mysqli, $sql);
  $totalrows = mysqli_num_rows($result);
  
  if($totalrows > 0){
   //echo "success";
   
   while($Linha = mysqli_fetch_array($result)){
        
    $state[] = $Linha['state'];
    $city[] = $Linha['city'];
    $name[] = $Linha['name'];
    $place[] = $Linha['place'];
    $date[] = $Linha['date'];
    $time[] = $Linha['time'];   
   }
   
    $output = json_encode(array($state, $city, $name, $place, $date, $time));
    echo $output;   
    
       
  }else{
   echo "failed";
  }

}

[Diego_Calp]

Hi, Please add this line console.log(JSON.stringify(data)) below success: function(data) { And post the resulting string here. I think there is a easier way than the one you are using, but depends on the data structure. Regards Diego

[Diego_Calp]

Try this, but not knowing how is data, I'm not sure it works:

var data = $.parseJSON(data);
for(var i=0; i<data.length; i++){
    var list_item = '<ion-item class="item widget uib_w_14 d-margins item-thumbnail-left" data-uib="ionic/list_item_avatar" data-ver="0">';
    list_item += '<img src="images/Strabburg.jpg" id="thumb">';
    list_item += '<h2>'+data.nome+'</h2>';
    list_item += '<p>'+data.dia+'</p>';
    list_item += '</ion-item>';
    $("#lista").append(list_item);
}

[madson_g_]

Cannot post the string here I don´t know why

What is the easier way? Thanks in advance.

[madson_g_]

do you mean this? I am very new to xdk

[Diego_Calp]

Yes, please do the same after

var data = $.parseJSON(data);

add this

console.log(JSON.stringify(data));

Regards,
Diego

[madson_g_]

First and second results

[madson_g_]

Please check my edited question with php file too

[Diego_Calp · Accepted solution]

Hi Madson,

Seems that json_encode in your php is not working as needed. The result of echo $output should be something with this structure:

[{"a":1,"b":2,"c":3,"d":4,"e":5},

{"a":1,"b":2,"c":3,"d":4,"e":5},

{"a":1,"b":2,"c":3,"d":4,"e":5}]

I'm not very experiencied in php, used it long time ago, if you manage to get an output like this I will be glad to help you with XDK part. json_encode has several parameters,

Regards,

Diego

[madson_g_]

Ok, I solved it fixing php according to http://diegocavalca.com/parte-4-construindo-a-api-para-integracao-de-dados/

Thanks for your time.