Przesyłanie danych do JS - w jaki sposób najlepiej?, split? xml? {zmienna:wartosc, zmienna2:wartosc2}? Opcje

[Apocalyptiq]

Chcąc co chwilę pobierać przez AJAX'a jakieś bardziej rozbudowane dane, trzeba je jakoś w JS przetworzyć. W jaki sposób najlepiej przesyłać JS'owi dane? Ja dotąd używałem takiego czegoś:

Kod

dana1|rekord1,rekord2,rekord3|info11*info21,info12*info22,info13*info23

No i tak wyciągałem dane:

Kod

var data=responeText.split("|");
   var dana=data[0];
   var rekordy=data[1].split(",");
   var infa=data[2].split(",");
   for each(var info in infa){
     var inf=info.split("*");
   }

Niby kod jest mało czytelny, ale całość kodu jest mała (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) Oczywiście uważam, aby w zmiennych nie wystąpiły znaki, którymi rozdzielam poszczególne dane.
Przeglądając inne strony (przy pomocy FireBuga->Konsola) widziałem czasami takie coś:

Kod

{costam:dana1,costam2:dana2}

Lecz bardziej rozbudowane, przykład z Betfair.com :

Kod

while(1) {};{"sysparams":{"version":"9.7.0-4"},"marketupdates":{"betDelay":5,"bspReconciled":false,"id":100007190,"profitAndLossForSettledBets":0.0,"status":"A","totalMoneyMatched":"USD 18,052"},"sportsParameters":{"form_YN":"N","liveScoreFeed_URL":"","form_URL":"","liveScoreDetail_URL":"","mvMicrosite_URL":""},"runnerprices":[{"bestBacks":[{"price":1.93,"size":10.0},{"price":1.92,"size":7.0},{"price":1.7,"size":18.0}],"bestLays":[{"price":0.0,"size":0.0},{"price":0.0,"size":0.0},{"price":0.0,"size":0.0}],"marketId":100007190,"runnerId":15315052},{"bestBacks":[{"price":1.51,"size":655.0},{"price":1.4,"size":83.0},{"price":1.38,"size":10.0}],"bestLays":[{"price":2.0,"size":25.0},{"price":0.0,"size":0.0},{"price":0.0,"size":0.0}],"marketId":100007190,"runnerId":15315053},{"bestBacks":[{"price":3.1,"size":14.0},{"price":3.0,"size":12.0},{"price":2.3,"size":68.0}],"bestLays":[{"price":10.0,"size":25.0},{"price":0.0,"size":0.0},{"price":0.0,"size":0.0}],"marketId":100007190,"runnerId":15315054}],"runners":[{"marketId":100007190,"name":"Denmark","runnerId":15315052,"selectionId":602688,"vacant":false},{"marketId":100007190,"name":"Russia","runnerId":15315053,"selectionId":602689,"vacant":false},{"marketId":100007190,"name":"Draw","runnerId":15315054,"selectionId":330157,"vacant":false}]}

Używał ktoś kiedyś tego sposobu? Jak z takiego czegoś można wygodnie wyciągnąć dane przez js? (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Nie znam się zbytnio na parsowaniu xml, ale tak sobie pomyślałem, że możnaby też przesyłać tego typu dane do JS za pomocą zapisu xml?

Proszę o Wasze opinie.

Ten post edytował Apocalyptiq 21.11.2008, 18:22:05

[woj_tas]

Polecam jquery + xml:
link

[Apocalyptiq]

Dzięki wojtas za linka (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Właśnie po jego przeczytaniu próbuję napisać shoutboxa, ale coś mi nie działa... Sprawdzałem w firebug'u - odpowiedź requesta jest ok - poprawny xml. Tylko że nie wykonuje mi funkcji zawartej w success (jak w firebugu sprawdzałem, w ogóle 'nie wchodzi' w zawartość success), tak to teraz wygląda:

Kod

function reShout(){
    $.ajax({
        url:"/getShout",
        dataType:"xml",
        data:"nr="+$("#last").val(),
        success:function(data){
            $(data).find("mesg").each(function(){
                var item=$("<div>");
                item.addClass("item");
                item.addClass($(this).attr("class"));
                item.html("<strong>"+$(this).find("autor").text()+"</strong> <small>"+$(this).find("date").text()+"</small>");
                $("#shoutbox").appendChild(item);
            });
            $("#last").val($(this).find("mesg:last").attr("id"));
        }
    });
}
   $(document).ready(function(){
   $("form[@name='shoutForm']").submit(function(){
       $.post("/sendMesg",
       {mesg:this.mesg.value},
       function(){
           reShout();
       });
   });
   /*odpalenie pobrania aktualnych wiadomości i odpalenie setIntervala pobierającego co 3 sekundy nowe wiadomości*/
   reShout();
   window.setInterval("reShout()",3000);
   });

Wie ktoś co tu może być nie tak (chodzi o samą funkcję reShout)? (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Ten post edytował Apocalyptiq 22.11.2008, 18:00:13

[bregovic]

XML nie jest zły, ale czy to nie overkill w tym przypadku? JSON by nie wystarczył?

[Apocalyptiq]

XML nie jest zły, ale czy to nie overkill w tym przypadku? JSON by nie wystarczył?

Dzięki bregovic! Zmieniłem z XML na JSON i zaczęło działać!
Tak teraz wygląda ten skrypt shoutboxa:

Kod

function reShout(){
     $.getJSON(
         "/",
         {page:"getShout",nr:$("#last").val()},
         function(mesgs){
         $.each(mesgs.mesg,function(n,item){
             var newMesg=$("<div>");
             newMesg.addClass("item");
             newMesg.addClass(item.class);
             newMesg.html("<strong>"+item.autor+"</strong> <small>"+item.date+"</small><br/>"+item.text);
             $("#shoutbox").append(newMesg);
         });
         $("#last").val(mesgs.lastNr);
         }
     );
     setTimeout("reShout();",3000);
}
$(document).ready(function(){
$("form[@name='shoutForm']").submit(function(){
     $.post("/sendMesg",
     {mesg:this.mesg.value},
     function(){
         reShout();
     });
     this.mesg.value="";
     return false;
});
reShout();
});

Zamiast odpalać interwał, wrzuciłem na koniec funkcji reShout (sprawdzanie czy nie ma nowych wiadomości) wywołanie tejże funkcji w setTimeoucie, a jak tylko DOM się załaduje - odpalam reShout() (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Jednak głupi pomysł z tym setTimeout - reShout() odpalałem też jak się wyśle jakąś wiadomość, a wtedy po wysłaniu wiadomości tworzył się dodatkowy setTimeout (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) Jednak lepszy jest setInterval (IMG:http://forum.php.pl/style_emoticons/default/winksmiley.jpg) Poprawiony skrypt:

Kod

function reShout(){
    $.getJSON(
        "/",
        {page:"getShout",nr:$("#last").val()},
        function(mesgs){
        $.each(mesgs.mesg,function(n,item){
            if($("#mesg"+item.nr).length==0){
                var newMesg=$("<div>");
                newMesg.attr("id","mesg"+item.nr);
                newMesg.addClass("item");
                newMesg.addClass(item.class);
                newMesg.html("<strong>"+item.autor+"</strong> <small>"+item.date+"</small><br/>"+item.text);
                $("#shoutbox").append(newMesg);
            }
        });
        $("#last").val(mesgs.lastNr);
        $("#shoutbox").attr("scrollTop",$("#shoutbox").attr("scrollHeight")-$("#shoutbox").attr("offsetHeight"));
        }
    );
}
$(document).ready(function(){
$("form[@name='shoutForm']").submit(function(event){
    $.post("/sendMesg",
    {mesg:this.mesg.value},
    function(){
        reShout();
    });
    this.mesg.value="";
    event.preventDefault();
    return false;
});
reShout();
window.setInterval("reShout()",3000);
});

Normalnie odpalony aby władowało wiadomości na starcie, a setInterval - co każde 3 sekundy.

Ten post edytował Apocalyptiq 23.11.2008, 12:24:06