Building Dynamic Data with Javascript

Asked

Viewed 127 times

0

I am working in a hybrid application, I am using HTML5 with Java Script, my idea is when the comrade login with his account, the application goes on the server and searches everything related to that person and already assembles in a listview all the rooms of that comrade.

function PesquisaTurma(){
EscreverConsole(console, "Pesquisando turmas");
var read_transition = db.transaction("tbl_TURMAS", "readonly"),
    store = read_transition.objectStore("tbl_TURMAS"),
    rows = store.openCursor(),  
    flag,
    HTMLNovo,
    index,
    $wrapper;
rows.onsuccess = function(evt){
    var cursor = evt.target.result;
    if(cursor)
    { 
    var bd =    db.transaction("tbl_PESSOA_TURMA").objectStore("tbl_PESSOA_TURMA");

        index = bd.index("COD_IDENT_TURMA");
        index.get(cursor.value.COD_IDENT_TURMA).onsuccess = function(event) { 
            $wrapper = document.querySelector('#turma'),

                // Pega a string do conteúdo atual
                var HTMLTemporario = $wrapper.innerHTML;

            flag = event.target.result.FLG_IDENT_PESSO;

            // Novo HTML que será inserido
            HTMLNovo = '<ion-item class="item widget btn_ESCOLHE_TURMA item-avatar" data-uib="ionic/list_item_avatar" data-ver="0">'+'<input id="w_codigo" type="hidden" value="'+cursor.value.COD_IDENT_TURMA+'"/>'+'<img src="images/icon36.png">'+'<h2>'+cursor.value.TXT_NOMEX_TURMA+'</h2>'+ '<p>'+((flag == "M") ? "Você é aluno." : "Você é professor")+'</p>'+'</ion-item>'; 

            HTMLNovo = HTMLNovo + HTMLTemporario;

            // Coloca a nova string(que é o HTML) no DOM
            $wrapper.innerHTML = HTMLNovo;

            //HTMLNovo = HTMLNovo + HTMLTemporario;

            // Coloca a nova string(que é o HTML) no DOM
           $('#turmas').append($wrapper);

        };
        cursor.continue();
    }
}
EscreverConsole(console, "Turmas pesquisadas com sucesso.");    
};

This code works cool, however happens 2 errors with it, but is not programming.

1º Problem - When I log in, I call this function, but it does not put the classes immediately in the application, it is necessary to update the page to appear.
2nd Problem - If I log in twice it puts the double, and this time it puts without needing to update the page.

javascript html5 mobile

  • $wrapper.innerHTML is apparently Htmltemporary, so you don’t need to add with Htmlnovo and then assign it back to $wrapper.innerHTML, understand ? I think this will solve your fold problem.

  • This problem worked, but the other continues.

  • The other problem I don’t know exactly, but the first time really comes something in $wrapper.innerHTML ?

  • It is a routine and it is the following, I search the database all the data, then run a routine that saves all this data in the local database, after that I do another procedure that searches the database all classes and assembles this listview.

  • I believe that after innerHTML, you will have to use appendchild(), take a look at this example: http://jsbin.com/diviyusufe/1/edit?html,js,console

  • Look how I did: HTML.innerHTML = Htmlnew; $wrapper.appendchild(HTML);

  • legal @Renan Rodrigues, and it worked appendchild ? is including the classes without needing the page ? otherwise the problem is simply in the selector which is not correct

  • @Thiagofriedman The problem of updating as soon as you log in I fixed, was because he was doing processes before others finish, but now when picking up classes only comes the last, would have to formulate an answer to min of how to do ?

  • I updated my code as it is now. The idea is that I need it to take 1 and add below the others, if you have 10 appears at 10.

  • Let’s go continue this discussion in chat.

Show 5 more comments

1 answer

0


All I had to do was add one so it carries everything. The error occurred because the classes were in memory, and when recharged it remained only one, doing one, it carries all the classes at once.

Follows the code:

                for(i=0; i < cursor.length; i++) 
            { 
                // Coloca a nova string(que é o HTML) no DOM
                $('#turmas').append($wrapper);
            }

Browser other questions tagged javascript html5 mobile

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