Jelikoz jsem nad tim stravil notnou davku casu (…), tak to tu davam, snad to nekomu bude prospesne. Kazdopadne, radim vami dobre, vykaslete se na vsechny objekty XMLHttpRequest, ActiveXObjects(ktere funguji pouze v IE) nebo jine frameworky urcene primo k tomuto, napr. ja jsem nasel XHConn.
Jedine co k tomu potrebujete je jQuery. Ja jsem pouzil verzi 1.4.1, kterou mate pokud pouzivate VS 2010 jiz v sablone. Nakonec jsem vybral 2 metody, ktere 100% funguji ve vsech 4rech nejpouzivanejsich prohlizecich(a funguje to i na localhostu, nekde jsem cetl ze chrome toto na localhostu neumi, tak jsem to kopiroval na hosting ale ted vidim – byl jsem naivni a hloupy ze jsem tomu veril), zkousel jsem to na techto prohlizecich: Google Chrome 17.0.963.56 m, Opera 11.61, Mozilla Firefox 10.0.1 a IE 8(jak jsem psal uz drive, nemam rad IE9 protoze ten je podle me jeste vetsi *vina nez IE8).
A ted ke samotnemu kodu, xml jsem nezkousel ale JSON funguje bezvadne ve vsech:
Jednodussi varianta bez parametru – metoda post:
|
1 2 3 4 5 6 7 8 |
function posli7() { $.post('SayHello.ashx', { 'tab': 'opera', 'rat': '7' }, function () { //libovolny kod co chcete udelat pokud se operace zdari }); } |
A slozitejsi varianta s parametry – metoda ajax:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
function posli9() { $.ajax ({ type: "GET", url: 'SayHello.ashx', data: { 'tab': 'opera', 'rat': '9' }, //"rat=9&tab=L" - jako data muzete zadat QueryString nebo json pri zachovani vseho ostatniho - funguje vsechno contentType: "application/json; charset=utf-8", dataType: "json", async: false, //To je asi dulezite pro chrome, ktery nezvlada asynchronni operace, taky jsem o tom cetl ale nezkousel success: function (response) { //Libovolny kod co se ma delat po uspechu } //error: branchAjaxFailed //-Muzete si vypsat i libovolny kod co delat v pripade chyby }); } |
Jako metodu success muzete zadat null, stejne se s temi daty asi neda nic delat – zrejme chyba v paremetru/metode success. Musite volat pro ziskani dat metodu get(viz nize).
Takze metoda se neda vyuzit i kdyz chcete ziskat data z handleru. Jinak metoda branchAjaxFailed muze vypadat nejak takto kdybyste ji chteli:
|
1 2 3 4 5 |
function branchAjaxFailed(result) { alert("FAILED : " + result.status + ' ' + result.statusText); } |
(to cislo za “posli” je poradove cislo metody – volal jsem je vsechny najednou a zkousel. #justsayin).
A ted jeste kod ASHX handleru:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<%@ WebHandler Language="C#" Class="SayHello" %> using System; using System.Web; public class SayHello: IHttpHandler { public void ProcessRequest(HttpContext context) { string param = context.Request.Params[ & quot; rat & quot;]; //-Je velice uzitecne ze vam to vraci primo stringy a ne objekty, ktere byste museli kontrolovat na null a pak je prevadet na ToString() string param2 = context.Request.Params[ & quot; tab & quot;]; //-Kdyz nejaky parametr nebude nalezen, web nebo kod samozrejme nezhavaruje ale promenna bude jen null string param3 = context.Request.Params[ & quot; tab2 & quot;]; if (param != null & amp; & amp; param2 != null) { string soubor = System.Web.Hosting.HostingEnvironment.MapPath( & quot; ~/a.txt"); System.IO.File.AppendAllText(soubor, param + & quot; & quot; + param2 + Environment.NewLine); } } public bool IsReusable { get { return false; } } } |
A jak vidite, handler zapisoval na disk obsahy parametru rat a tab. Vysledek(kdyz jsem pred kazdym browserem menil parametr tab v JS) je takovy:
7 ie
9 ie
7 chrome
9 chrome
7 firefox
9 firefox
7 opera
9 opera
Pokousel jsem se i ziskat z handleru data metodou .ajax ale at jsem volal metodu prompt nebo alert, tak se mi nic nezobrazilo. Proto pokud chcete ziskat data, musite volat metodu .get a parametry predat v querystringu:
|
1 2 3 4 5 6 7 8 |
function ziskej1() { $.get('SayHello.ashx?id=1', function (data) { $('#result').html(data); }); } |
Pokud potrebujete ziskat vice parametru, musite si je jednoduse vyparsovat z parametru data.
Pokud volate metodu get, musite v handleru zapisovat napriklad metodou context.Response.Write(zde vracim ten querystring parametr ktery jsem mu predal – funguje):
|
1 |
context.Response.Write(context.Request.QueryString["id"]); |
Objevil jsem i na netu priklady volani webovych sluzeb, ale ja jsem si to rozdelil – webove sluzby(asmx) budu pouzivat pro spolupraci webu a desktopovych aplikaci.
Handlery(ashx) naopak kdyz stranka bude potrebovat neco po serveru bez reloadu/postbacku.