Codeigniter Jquery Ajax: How to loop returned data as html

Question

Im new to JQuery AJAX thing, this is my script:

$(document).ready(function() {
  $("#city").change(function() {

    var city_id = $("#city").val();

    if (city_id != '') {
      $.ajax({
        type: "POST",
        url: "<?php echo base_url() ?>index.php/home/get_block_by_id/" + city_id,
        success: function(block_list) {
          // WHAT TO PUT HERE ?
        },
      });
    }
});

If i put console.log(block_list) it returns the right data with JSON type:

[{"id":"1601","id_city":"16","block":"A"},
{"id":"1602","id_city":"16","block":"B"}]

What is the correct way to loop the returned data? I did this to see what the loop returned:

$.each(block_list, function() {
  $.each(this, function(index, val) {
    console.log(index + '=' + val);
  });
});

But it was totally messed up :(, if the looped data is correct I also want to put the id as a value and block name as a text for my <option> tag how to do that? thank you.

UPDATE

Sorry, I have try both answer and its not working, I try to change my code to this:

$("#city").change(function(){

        var city_id = $("#city").val();

        $.get("<?php echo base_url() ?>index.php/home/get_block_by_id/" + city_id, function(data) {
          $.each(data, function(id, val) {
            console.log(val.id);
          });
        });

      });

it returns :

**UNDEFINED**

I also try to change it into val[id] or val['id'] still not working, help :(

AKS · Accepted Answer · 2014-11-13 09:51:46Z

2

$.each(block_list, function(id, block){
    console.log('<option value="' + block['id'] + '">' + block['block'] + '</option>')
});

The output would be:

<option value="1601">A</option>
<option value="1602">B</option>

edited Nov 13, 2014 at 9:51

answered Nov 13, 2014 at 9:44

AKS

20k3 gold badges47 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

pgee70 · Accepted Answer · 2014-11-13 09:47:47Z

0

try something like:

success: function(data, textStatus, jqXHR) {
    if (typeof(data)=='object'){
          for (var i = 0; i < data.length; i++) {
            console.log(data[i].id + ':' + data[i].id_city);
           }
    }
}

answered Nov 13, 2014 at 9:47

pgee70

4,0735 gold badges39 silver badges45 bronze badges

Comments

sanjeeviraj · Accepted Answer · 2014-11-18 00:59:13Z

0

if ur json output is in this format

[{"id":"1601","id_city":"16","block":"A"},
{"id":"1602","id_city":"16","block":"B"}]

then

var city_id = $("#city").val();
if (city_id != '') {
  $.ajax({
    type: "POST",
    url: "<?php echo base_url() ?>index.php/home/get_block_by_id/" + city_id,
    success: function(data) {
            $.each(data, function(index) 
            {
                console.log(data[index]['id']);
                $('#'+ddname+'')
                .append($("<option></option>")
                .text(data[index]['id']+"-"+data[index]['block']));
            });
    },
  });
}

answered Nov 18, 2014 at 0:59

sanjeeviraj

1551 gold badge2 silver badges11 bronze badges

Collectives™ on Stack Overflow

Codeigniter Jquery Ajax: How to loop returned data as html

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related