Keskustelu: Ohjelmointikysymykset: JavaScript / Ajax: mielipiteitä?

Mitä mieltä olette Ajaxista? Hyviä/huonoja puolia? Vaatii joitain selainasetuksia omien testieni mukaan. Kuullostaa lähinnä viritykseltä, kun joudutaan käyttämään XMLHttpRequest- objektia, ihan samaan tapaan kun vaikka vb-scriptissä. Epäilyttää.

(Mod. korjasi otsikon..?)

Miten Java liityy Ajaxiin? Tarkoititko JavaScriptiä?

Ajaxilla saa tehtyä sivuille dynaamisesti muuttuvaa sisältöä, joka muutoin vaatisi sivun lataamisen uudestaan, mutta Ajaxilla palvelimelle lähetetään ja sieltä ladataan tavaraa ilman sivun päivittämistä. Ajaxin käyttäminen on kuulemma vaikeaa. Vaihtoehtoisena tapana on käyttää esim. Flashiä tai Java-applettia.

Ennen kuin Ajax-käsite yleistyi, samat asiat saatettiin hoitaa siten, että JavaScriptillä päiviteltiin piilossa olevaa IFRAME:a tai kutsuttiin piilossa olevan Java-appletin julkisia metodeja (appletti otti yhteyden palvelimeen). Useimmiten tyydyttiin siihen, että koko sivu pitää aina ladata uudestaan.

Miten se XMLHttpRequest siitä virityksen tekee? "Aika viritystä koko HTML, kun pitää jotain body-elementtiä käyttää."

Itse pidän periaatteena, että kaiken on oltava käytettävissä melko alkeellisellakin tekstiselaimella, eli framellisesta sivusta on oltava frameton versio ja JS-ominaisuuksien on oltava mukavuutta varten, ei toiminnan takia. AJAX sinänsä on siis aivan kelvollinen asia ja parantaa toisinaan käytettävyyttä esimerkiksi vähentämällä uudelleenlatausta jne, mutta lähes minkä tahansa sivun olisi syytä toimia tarvittaessa ilmankin sitä. Kaikki eivät käytä JS:ää, ja toisinaan tulee käytettyä tekstiselaimia, jotka eivät sellaista edes tue.

Jo ilmankin JS:ää on helppo tehdä sivuja, jotka ovat tekstiselaimella äärimmäisen vaikeakäyttöisiä tai jopa mahdottomia. JS:n kanssa yksi yleinen virhe on laittaa linkkejä tai formeja toimimaan ainoastaan JS:n kautta, vaikkei tälle olisi edes mitään tarvetta. Toivottavasti AJAX ei vie asioita siihen, ettei sivustoilta saa enää kuin etusivun ilman AJAXia tukevaa selainta.

Siis hieman kuin alkoholi: tilkka voi olla jopa hyväksi, kohtuukäyttö ei haittaa, liika tappaa kaiken, ja ei pidä koskea liian nuorena. ;)

Tällaista valitusta tällä kertaa.

Jackal von ÖRF kirjoitti:

Ajaxin käyttäminen on kuulemma vaikeaa.

Hmm, minusta se on todella yksinkertaista. Siihen tarvitsee vain funktion, joka ottaa parametreinä lähetettävän datan, osoitteen ja jonkun toisen funktion (tai useamman erilaisten vastausten varalle), jota sitten kutsutaan kun serveri vastaa.

Jonkun verran on tullut Ajaxia käytettyä, sillä saa aika kätevästi tehtyä kaikenlaista.

<rant>
Java ja JavaScript ovat todella erilaisia kieliä, jonka kuka tahansa molempia kieliä edes pintapuolisesti tunteva tietää. Vertaa esim. tyypitystä, oliosysteemiä ja funktionaalisuutta. Syntaksi ja nimi ovat samantapaisia, mutta niillä ei olekaan paljoa merkitystä. "Oikea Java (ei JavaScript)" kuulostaa aivan yhtä tyhmältä kuin vaikka "oikea Lisp (ei Ruby)".
</rant>

Ehdotan siirtoa Nettisivut ja -ohjelmointi -alueelle. Mitä tulee purkkaan, itse olen käyttänyt jQueryä Ajaxin ajoon, ja on toiminut käytännössä kaikkialla missä sitä olen keksinyt kokeilla. Varsinkin pienempiin hommiin valmiit kirjastot soveltuvat oikein mainiosti.

funktio kirjoitti:

Jackal von ÖRF kirjoitti:

Ajaxin käyttäminen on kuulemma vaikeaa.

Hmm, minusta se on todella yksinkertaista. Siihen tarvitsee vain funktion, joka ottaa parametreinä lähetettävän datan, osoitteen ja jonkun toisen funktion (tai useamman erilaisten vastausten varalle), jota sitten kutsutaan kun serveri vastaa.

Tarkoitin lähinnä sitä, että kun HTML+JavaScriptillä ryhdytään rakentamaan edistyneitä käyttöliittymäratkaisuja, niin se on vaikeampaa kuin työpöytäsovelluksia tehdessä, johtuen mm. JavaScriptin event-systeemistä (esim. onchange-event lähtee vasta, kun kenttä menettää fokuksen, eikä onkeypress:llä pysty sitä korvaamana, koska se ei huomaa kenttään hiirellä pastetettua tekstiä, joten ainoa varmasti toimiva keino on pollata kentän sisältöä 100ms välein).

Heippa taas!

Jackal von ÖRF kirjoitti:

JavaScriptin event-systeemistä (esim. onchange-event lähtee vasta, kun kenttä menettää fokuksen, eikä onkeypress:llä pysty sitä korvaamana, koska se ei huomaa kenttään hiirellä pastetettua tekstiä, joten ainoa varmasti toimiva keino on pollata kentän sisältöä 100ms välein).

onkeydown- ja onbeforepaste-eventtiä voidaan käyttää textboxin sisällön varastoimiseen globaaliin muuttujaan vertailua varten ja onchange-eventin sijaan voidaan käyttää onkeyup- ja mouseout-eventtiä.

tässä vähän JavaScript-purkkaa testattavaksi...(karsin ton textarean huvikseni textboxiksi)

scripti.js

var txtbox1_compStr;  //jne...

function initGlobals(){
  if(( txtbox1_compStr == undefined)||( txtbox1_compStr == null)){
      txtbox1_compStr = "";
  }
  //jne...
}


function set_textbox1_compStr(obj){
  var elem = getControl(obj);
  if((elem == undefined) || (elem == null)){return;}
  txtbox1_compStr = elem.value;
}

 //jne...

function comp_textbox1_compStr(obj){
  var elem = getControl(obj);
  if((elem == undefined) || (elem == null)){return;}
  if(txtbox1_compStr !=  elem.value){

    if(elem.value.indexOf("\r\n") > -1){
      elem.value = elem.value.substr(0, elem.value.indexOf("\r\n"));
    }

    if(elem.value.length > 20){
      elem.value = elem.value.substr(0, 20);
    }
    txtbox1_compStr = elem.value;
  }
}

//jne...

function getControl(ctlid){
  var frm = document.all('form1');
  for(var i=0 ; i < frm.elements.length; i++){
    try{
      if (frm.elements[i].id == ctlid){
        return frm.elements[i];
      }
    }
    catch(e){}
  }
  return null;
}

html

<html><head><script language="javascript" src="scripti.js"></script>
</head><body onload="initGlobals();"><form id="form1">
   <div runat="rullaa missä ikinä tykkäät">
      <textarea id="txtboxi1" rows="1" cols="20" wrap="off"
         style="font-size:medium; border-width:2; border-style:inset; overflow:hidden"
         onkeydown="set_textbox1_compStr(this.id);"
         onkeyup="comp_textbox1_compStr(this.id);"
         onbeforepaste="set_textbox1_compStr(this.id);"
         onmouseout="comp_textbox1_compStr(this.id);" ></textarea>
  </div>
</form></body></html>

Eli tarvitaan monta kymmentä riviä JavaScriptiä ja neljä HTML-elementin atribuuttia, jotta noinkin yksinkertainen asia saadaan hoidettua. Joissain toisissa kielissä ja ympäristöissä pääsee paljon helpommalla.

"Eli tarvitaan monta kymmentä riviä JavaScriptiä ja neljä HTML-elementin atribuuttia, jotta noinkin yksinkertainen asia saadaan hoidettua. Joissain toisissa kielissä ja ympäristöissä pääsee paljon helpommalla."

Sen takia on työkaluja olemassa ettei kaikkea tarvitse kirjoittaa käsin. Jos kuulostaa liian hankalalta, pysy staattisessa html-kielessä, tai perinteisessä serveriskriptauksessa.