Kirjautuminen

Haku

Tehtävät

Keskustelu: Nettisivujen teko: Javascript/Ajaxilla haetut tiedot muuttujiin

Sivu 1 / 1

hannu.laine [11.03.2021 11:39:16]

#

Olen todellinen aloittelija Javascriptissä koska olen tehnyt paljon ohjelmia php:lla. Niissä on käytetty vain joitakin Javascriptejä
muuttamaan jotain sivulla olevaa tietoa myös tietokannassa.

Php:n ominaisuus ladata sivu aina uudelleen kun palvelimella on tehty tarvittavat toimenpiteet on kuitenkin
melko hidas ja varsinkin mobiililaitteilla käytettynä vähän epävarma.

Nyt olen aloittanut online-varausten tekemisiin tehdyn sivun muuttamisen javascript pohjaiseksi. En pääse kuitenkaan alkua pidemmälle.
Olen lukenut erinäisen määrän ohjeita ja oppaita mutta niissä kaikissa kerrotaan vain yksittäisistä funktioista mutta ei Javascriptin olemuksesta.
Apua siis tarvitaan kipeästi.

Olen onnistunut luomaan sensitiivisen sivun (bootstrap-pohjalta) jossa <div id="rekpuh">:ssa annetaan rekisterinumero ja gsm-numero.
Se käynnistää Ajaxilla kyselyn ko tiedoilla ja palauttaa auton tiedot, jos auto löytyy tietokannasta. Ne tulevat <input> kenttinä
näkyviin sivun <div id="auto"></div>:ssä ja tarkoitus olisi valita/piilottaa sivun divejä sitä mukaa kun varaus etenee.
En kuitenkaan onnistu lukemaan ruudulle Ajaxilla saauja tietoja

<input type="text" id="arek" size=10 value="'. $rek.'">
	<input type="text" id="merkki" size=15 value="'. $merkki.'">
	<input type="text" id="nimi" size=20 value="'. $nimi.'">
	<input type="text" id="aID" size=5 value="'. $aID.'">

muuttujiin valitakseni, mitä ruudulla näkyy. Sivua ei ole siis tässä vaiheessa ladattu kertaakaan uudelleen.

Tarkoitus on piilottaa kirjautumiseen käytetty "rekpuh" div jos auton ID löytyi rekkarilla ja puhelinnumerolla haettuna

$(document).ready(function(){
	var x = document.GetElementById("aID").value;
	var y = document.getElementById("rekpuh");
	if(x>0)
			y.style.display = "none";
	else
			y.style.display = "block";
	document.GetElementById("rekpuh").innerHTML = y;
  });

Jos jotenkin onnistun tässä, pääsen pitkän matkan eteenpäin sivun suunnittelussa.

walkout_ [11.03.2021 13:23:59]

#

Eihän tuossa sinun esimerkissä ole edes mitään viitteitä AJAX-kyselykoodiin: https://api.jquery.com/jquery.ajax/

Grez [11.03.2021 14:37:22]

#

hannu.laine kirjoitti:

Olen lukenut erinäisen määrän ohjeita ja oppaita mutta niissä kaikissa kerrotaan vain yksittäisistä funktioista mutta ei Javascriptin olemuksesta.

Ehkä sit kannattais ottaa joku kurssi, jossa käsiteltäisiin Javascriptin olemusta.

Itsellä ei ole kokomusta tästä kurssista mutta kuvauksen perusteella vaikutti lupaavalta ja on ilmainen jos oikein ymmärsin...
https://www.udemy.com/course/javascript-essentials/

The Alchemist [11.03.2021 15:23:27]

#

Aivan ensimmäisenä pistää silmään se, ettet osaa edes kirjoittaa funktioiden nimiä oikein. Javascriptissä kirjoitusasulla on merkitystä, eli et voi kutsua esimerkiksi funktiota "GetElementById" vaan nimi täytyy kirjoittaa muodossa "getElementById" (ensimmäinen g-kirjain pienaakkosilla).

Tuollaiset virheet jo itsessään johtavat koodin suorituksen keskeytymiseen, joten minusta tuntuu, ettet osaa edes tunnistaa, missä kohtaa koodia virhe milloinkin tapahtuu.

Tämän asian selvittämiseksi voi googlettaa vaikka hakusanoilla "error console" + käyttämäsi nettiselaimen nimi.

hannu.laine [12.03.2021 09:17:04]

#

The Alchemist, suuret kiitokset vastauksestasi. Nyt näen missä virheet tapahtuvat ja pääsen tässä aimo harppauksen eteenpäin. Yritin seurata sitä kurssivideota mutta se oikein pyörinyt minun Macissani. Etsin niitä lisää.

Terv Hannu 73v

Vastaus

Muista lukea kirjoitusohjeet.
Tietoa sivustosta