Ajax w dojo toolkit
Wcześniej pokazałem jak wykorzystywać Ajax w inny sposób - czy to z wykorzystaniem obiektu XMLHttpRequest, czy też biblioteki jQuery. W tym wpisie pokażę podstawy wykorzystywania mechanizmów dojo do obsługi asynchronicznych żądań HTTP.
Na początek
Metoda dojo.xhr
XHR jest skrótem od XMLHttpRequest. Metoda ta służy do obsługi requestów Ajax. Posiada 3 parametry:
dojo.xhr(/*String*/method, /*Object*/args, [/*Boolean*/hasBody])
Pierwszy parametr przyjmuje jako wartość nazwę metody HTTP. Możliwe wartości:
- GET
- POST
- DELETE
- PUT
Drugim parametrem jest obiekt definiujący wszystkie dane potrzebne do wykonania i obsłużenia requestu.
Trzeci parametr jest opcjonalny. Jeśli ustawiony na `true' do `args' dodajemy opcję `content'.
Przykład
<html>
<head>
<title>Ajax w dojo</title>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js"></script>
<script type="text/javascript">
dojo.addOnLoad(function()
{
dojo.xhr("GET", {
url : "plik.txt",
load : function(response, ioArgs) {
alert(response);
return response;
},
error : function(response, ioArgs) {
alert("Wystąpił błąd\n" + response);
return response;
}
});
});
</script>
</head>
<body></body></html>
W 'plik.txt' należy umieścić dowolny ciąg znaków, np.:
Witaj świecie
Inny format danych i ułatwiające metody
Prócz `dojo.xhr' występują jeszcze:
- dojo.xhrGet(/*Object*/ args) [dokumentacja]
- dojo.xhrPost(/*Object*/ args) [dokumentacja]
- dojo.rawXhrPost(/*Object*/ args) [dokumentacja]
- dojo.xhrPut(/*Object*/ args) [dokumentacja]
- dojo.rawXhrPut(/*Object*/ args)
- dojo.xhrDelete(/*Object*/ args) [dokumentacja]
W poprzednim przykładzie wykorzystałem metodę GET. Tym razem użyję POST z wykorzystaniem odpowiedniej metody dojo.xhrPost.
<html>
<head>
<title>Ajax w dojo</title>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js"></script>
<script type="text/javascript">
dojo.addOnLoad(function()
{
dojo.xhrPost({
url : "plik.json",
handleAs : "json",
load : function(response, ioArgs) {
alert(response.result);
return response;
},
error : function(response, ioArgs) {
alert("Wystąpił błąd\n" + response);
return response;
}
});
});
</script>
</head>
<body></body></html>
Tym razem wykorzystuję plik 'plik.json', którego zawartość przedstawia się tak:
{"result" : "Działa!"}
Przeczytaj więcej o parsowaniu JSON:
Deferred
Dojo posiada także mechanizm deferred. TODO