0

I want to get the length of data, when i try console.log(data) i got all of data but console.log(data.length) is undefined.

function tampilesai(idsoal){
$.ajax({
    url: "soalesai/baca/"+idsoal,
    type: "POST",
    dataType: "JSON",
    success: function(data){
        console.log(data); //here <=================
        console.log(data.length); //here <=============

        var html = "";   
        for (i = 0; i < data.length; ++i) {     
            html += "<tr>" +
                "<td class='isitbl'>" + data[i].idsoal + "</td>" +
                "<td class='isitbl' style='width:20px;'>" + data[i].noesai + "</td>" +
                "<td class='isitbl' style='width:200px;'>" + data[i].matakuliah + "</td>" +
                "<td>" + data[i].isiesai + "</td>" +
                "<td class='isitbl'><button class='btn btn-danger btn-block' id='hapus' data[i]-id='" + data[i].idsoal + "'>" +
                "<span class='icon-trash'></span> Hapus</button>" +
                "</td>" +
                "</tr>";
        }
        $("tbody#tblesai").html(html);
    }
})

i need data.length for loop and fill my table. its data log

{idesai: "90", idsoal: "1", noesai: "1", matakuliah: "1", isiesai: "<p>asdd</p>"}

this image browser

enter image description here

Marco Daniel
  • 5,467
  • 5
  • 28
  • 36
Al azmi
  • 3
  • 3
  • Assuming it's not [this problem](http://stackoverflow.com/questions/38660832/element-children-has-elements-but-returns-empty-htmlcollection) (and I wouldn't expect it to be from the above), I'd say that what you're seeing with "all the data" isn't an array, it's an object with properties. We can't help you without a minimal example of what that data is. – T.J. Crowder Jun 09 '19 at 16:21
  • sorry i'l edit my question.. – Al azmi Jun 09 '19 at 16:25
  • If your data is object then just use the `Object.keys(data).length` to get the length of that object. – Sifat Haque Jun 09 '19 at 16:25
  • 1
    @SifatHaque - The more relevant advice might be "...use `$.each` (or `Object.values`) to loop through the object's properties." But really, we need to see the data in order to offer reasonable advice that doesn't just take the OP down a rabbithole... – T.J. Crowder Jun 09 '19 at 16:30
  • i used Object.keys(data).length and i got the data.length ^^ but now the problem.. data[i].idsoal is undefined – Al azmi Jun 09 '19 at 16:31
  • @Alazmi i think you are trying to loop through an object and that's why your `data[i].idsoal` is undefined. You can check this answer to get the idea how to loop through an object https://stackoverflow.com/a/684692/5146848 – Sifat Haque Jun 09 '19 at 16:36

3 Answers3

1

If your data is an Object then you need to use Object.keys(data).length instead to get the length of the data object.

Sifat Haque
  • 5,357
  • 1
  • 16
  • 23
0

Try the following... Convert the result data into JSON object. Although the return type was explicitly stated as JSON, but some version of jQuery may not parse it automatically. I ran into such bug with some version 2.x

    var data = $.parseJSON(data);
    // console.log(data.length) *should return 1
    var html = "";   
    $.each(data, function(c) {     
        html += "<tr>" +
        "<td class='isitbl'>" + c.idsoal + "</td>" +
        "<td class='isitbl' style='width:20px;'>" + c.noesai + "</td>" +
        "<td class='isitbl' style='width:200px;'>" + c.matakuliah + "</td>" +
        "<td>" + c.isiesai + "</td>" +
        "<td class='isitbl'><button class='btn btn-danger btn-block' id='hapus' data[i]-id='" + c.idsoal + "'>" +
        "<span class='icon-trash'></span> Hapus</button>" +
        "</td>" +
        "</tr>";
    });
    $("tbody#tblesai").html(html);

I have not tested this, but I think it will give you an alternative idea.

maswerdna
  • 315
  • 2
  • 10
  • data is null when i used var data = $.parseJSON(data); .. but when i delete this, table is show and data still undifined.. i edited my question with image now.. – Al azmi Jun 09 '19 at 17:03
  • What I saw in the console seemed not to be a well formatted JSON object. I was expecting something like `0:{idesai: "90"...` this ensures that the data is serialized. 1. Did you JSON encode the data from the backend? – maswerdna Jun 09 '19 at 17:18
  • Can you **expand the data log** on the console and upload the image? So that we can see the complete structure. _Click on the expansion caret that points to the beginning of the object_. – maswerdna Jun 09 '19 at 17:22
0

Finish.. 

function tampilesai(idsoal){
$.ajax({
    url: "soalesai/ambil/"+idsoal,
    type: "POST",
    dataType: "JSON",
    success: function(data){
        var html = "";
        for(i=0;i<data.length;i++){
            html += "<tr>" +
                "<td class='isitbl'>" + data[i].idsoal + "</td>" +
                "<td class='isitbl' style='width:20px;'>" + data[i].noesai + "</td>" +
                "<td class='isitbl' style='width:200px;'>" + data[i].matakuliah + "</td>" +
                "<td>" + data[i].isiesai + "</td>" +
                "<td class='isitbl'><button class='btn btn-danger btn-block' id='hapus' data-id='" + data[i].idsoal + "'>" +
                "<span class='icon-trash'></span> Hapus</button>" +
                "</td>" +
                "</tr>";
        }
        $("tbody#tblesai").html(html);
    }
})

}

i change my controller

public function ambil($idsoal){
    echo json_encode(
            $this->pertanyaan_model
                ->ambilsoal($idsoal)->result());
}

and my model..

public function ambilsoal($idsoal){
    $query = $this->db
                ->where("idsoal",$idsoal)
                ->get("tblsoalesai");
    return $query;
}

and its works, thanks guys try to help me.. love you

Al azmi
  • 3
  • 3