Generate Html second Json object

Asked

Viewed 550 times

0

I need to receive a Json with the selection of activities and generate the HTML according to this data.

I believe that it should be more or less like this, someone can give me some hint to improve?

<script>
$(document).ready(function () {
    var CodigoMilestone = $("#CodigoMilestone");
    $.ajax({
        type: "GET",
        url: "/Dashboard/GetAtividades",
        sucess: function (atividades) {

            if (atividades != null) {
                $(atividades).each(function (i) {

                    var div = "<div> <table>";
                    var tr = "<tr>";
                    div +=
                    tr += "<td>" + atividades[i].InicioCedo;
                    tr += "<td>" + atividades[i].TempoRevisado;
                    tr += "<td>" + atividades[i].TerminoCedo;                        
                    div.append(tr);

                    tr += "<td>";
                    tr += "<td>" + atividades.Descricao;
                    tr += "<td>";
                    div.append(tr);

                    tr += "<td>" + atividades[i].InicioTarde;
                    tr += "<td>" + atividades[i].Folga;
                    tr += "<td>" + atividades[i].TerminoTarde;
                    div.append(tr);

                })
            }
        }
    })
});

Below a Json object:

[{"Codigo":7,"Descricao":"Atividade 1","CodigoMilestone":6,"TempoRevisado":2,"Inicio":"\/Date(1445738400000)\/","InicioCedo":"\/Date(1445738400000)\/","InicioTarde":"\/Date(-62135589600000)\/","TerminoCedo":"\/Date(1445911200000)\/","TerminoTarde":"\/Date(-62135589600000)\/","Ativo":true,"Milestone":null,"Dependencia":[],"Dependencia1":[]},{"Codigo":8,"Descricao":"Ativade 2","CodigoMilestone":6,"TempoRevisado":2,"Inicio":"\/Date(1445997600000)\/","InicioCedo":"\/Date(1445997600000)\/","InicioTarde":"\/Date(1445911200000)\/","TerminoCedo":"\/Date(1446084000000)\/","TerminoTarde":"\/Date(1446084000000)\/","Ativo":true,"Milestone":null,"Dependencia":[],"Dependencia1":[]}]

inserir a descrição da imagem aqui

  • Put the Object of activities to see how it looks, this having some problem or and only matter of code optimization/ produce a more elegant code ?

  • I edited my question. It’s not working yet.

  • if you make a console.log(atividades); you get some feedback from php ?

  • My project is in ASP.net MVC

  • I understood, the mistake is in your div, I will make an example

1 answer

0


Your code has some errors like $.each syntax and the use of a jquery selector, let’s go to the following example,

Let’s say you have a div with content id like this:

  <div id="conteudo"></div>

So I want to be able to put my information that is on an object called activities within that div.

 if (atividades != null) {
    var table = '';
    $.each(atividades,function (key,val) {
        table += '<table>';
        table += '<thead><tr><th>Código</th><th>Descrição</th></tr></thead>';
        table += '<tbody><tr><td>'+val.Codigo+'</td><td>'+ val.Descricao+'</td></tr></tbody>';
        table += '</table>'
    })
    $("#conteudo").append(table);
}

The ok validation, then I go through the object by putting my values in a table, and after each I give an append.

See working on Jsfiddle

Now just work on your html and put the rest of your values in the table.

  • I have to make a table for each activity, as shown in the question (updated the question)

  • only pass the table by string inside each, updated answer, example: http://jsfiddle.net/filadown/3a7p7yxo/3/

Browser other questions tagged

You are not signed in. Login or sign up in order to post.