Caut Ajax padot input value

Parasts cilvēks · August 28, 2010

Ir vienkārša forma, kur izvēloties option, caur ajax padodas vērtība, attiecīgi nākošajā logā atkarībā pēc option izvēles atrādas vārds..

Tas izskatās šādi:

INDEX FAILS:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>

<script>
function ajaxFunction(){
var ajaxRequest;
try{
ajaxRequest = new XMLHttpRequest();
}
catch (e)
{
try
	{
	  ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
	} 
catch (e) 
	{
		try	
		{
		 ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
		} 
		catch (e)
		{
 			 alert("Your browser broke!");
		 return false;
		}
	}

}

ajaxRequest.onreadystatechange = function()
{
if(ajaxRequest.readyState == 4)
{

		var ajaxDisplay = document.getElementById('tabula');
		ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}

var numurs = document.getElementById("numurs").options[document.getElementById("numurs").selectedIndex].value;


var queryString = "?numurs=" + numurs;

var strings = "atbilde.php" + queryString;

ajaxRequest.open("GET", strings, true);
ajaxRequest.send(null); 
}
</script>




</head>

<body>

<div id="tabula">

<select id="numurs" name="numurs" onchange="ajaxFunction()" />
<option value="1">1</option>
<option value="2">2</option>
   <option value="3">3</option>
</select>

<select id="vards" name="vards" />
<option value="">---</option>
</select>

</div>

</body>
</html>

APSTRĀDES FAILS:


<?php

if (($_GET['numurs']) == "1") {$vards = "Janis";}
if (($_GET['numurs']) == "2") {$vards = "Valdis";}
if (($_GET['numurs']) == "3") {$vards = "Peteris";}

echo '
<select id="numurs" name="numurs" onchange="ajaxFunction()" />
<option value="'.$_GET['numurs'].'">'.$_GET['numurs'].'</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

<select id="vards" name="vards" onchange="ajaxFunction()" />
<option value="'.$vards.'">'.$vards.'</option>
</select>
';

?>

Bet man vajag, padot vērtību nevis no options, bet gan no parasta inputa.

INDEX fails izskatītos šādi:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>

<script>
function ajaxFunction(){
var ajaxRequest;
try{
ajaxRequest = new XMLHttpRequest();
}
catch (e)
{
try
	{
	  ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
	} 
catch (e) 
	{
		try	
		{
		 ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
		} 
		catch (e)
		{
 			 alert("Your browser broke!");
		 return false;
		}
	}

}

ajaxRequest.onreadystatechange = function()
{
if(ajaxRequest.readyState == 4)
{

		var ajaxDisplay = document.getElementById('tabula');
		ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}

var numurs = document.getElementById("numurs").options[document.getElementById("numurs").selectedIndex].value;


var queryString = "?numurs=" + numurs;

var strings = "atbilde.php" + queryString;

ajaxRequest.open("GET", strings, true);
ajaxRequest.send(null); 
}
</script>




</head>

<body>

<div id="tabula">

<input id="numurs" name="numurs" type="text" onchange="ajaxFunction()" />

<select id="vards" name="vards" />
<option value="">---</option>
</select>

</div>

</body>
</html>

Mēģināju viskautko ajaxā mainīt, bet kaut kā galīgi nesanāk.

Varbūt kāds var pateikt, kā pareizi padot to vērtību, otrajā variantā.

Paldies jau iepriekš!

Леший · August 28, 2010

var numurs = document.getElementById("numurs").value;

Parasts cilvēks · August 28, 2010

SUPER!

Liels paldies...

Vēl varbūt var kāds pateikt vēl vienu lietiņu?

Piemēram šinī piemērā man vērtības bija 1, 2, 3

Un tad kad ieraksta 1 un nospiež TAB, vai kaut kur blakus, tad ajax nostrādā

Vai ir tāda iespēja, kā piemēram uzrakstot 1 ajax automātiski nostrādā, nevajag nemaz spiest ne TAB, ne arī kaut kut blakus???

Леший · August 28, 2010

samaini onchange uz onkeyup i būs tev laime.

Parasts cilvēks · August 28, 2010

Super, itkā viss ok, vienīgais, ja jāraksta garāks teksts, tad pēc katra burta ievadīšanas atkal jāiet virsū ar peli un lauka, lai varētu rakstīt tālāk.

Nevar kaut kā izdarīt, lai tajā logā var rakstīt garāku vārtu, nelikšķinot atkārtoti ar peli?

P.S. Gribēju pajautāt vēl vienu lietu, kas droši vien gluži uz šo tēmu neattiecas, bet tomēs:

Pārlūka programmas atmiņā saglabā ievadīto informāciju iekš INPUT, tobiš, ja es kādreiz ievadīju iekšā piemēram Jānis, Valdis, Pēteris, Agris utt, tad uzejot uz lauka man apakšā izmet visu sarakstu kas ir saglabājies, protams pēc tam ievadot burtu a, paliek tikai tasm kas sākas uz a.

Protams to var atslēgt pašā pārlūka programma. Bet kā lai izdara tā, lai ievadītā informācija nekur nesaglabātos, neatkarīgi no pārlūka programmas uzstādījumiem..

Paldies!

Леший · August 28, 2010

Super, itkā viss ok, vienīgais, ja jāraksta garāks teksts, tad pēc katra burta ievadīšanas atkal jāiet virsū ar peli un lauka, lai varētu rakstīt tālāk.

Nevar kaut kā izdarīt, lai tajā logā var rakstīt garāku vārtu, nelikšķinot atkārtoti ar peli?

<input id="numurs" name="numurs" type="text" onchange="ajaxFunction(); this.focus();" />

P.S. Gribēju pajautāt vēl vienu lietu, kas droši vien gluži uz šo tēmu neattiecas, bet tomēs:

Pārlūka programmas atmiņā saglabā ievadīto informāciju iekš INPUT, tobiš, ja es kādreiz ievadīju iekšā piemēram Jānis, Valdis, Pēteris, Agris utt, tad uzejot uz lauka man apakšā izmet visu sarakstu kas ir saglabājies, protams pēc tam ievadot burtu a, paliek tikai tasm kas sākas uz a.

Protams to var atslēgt pašā pārlūka programma. Bet kā lai izdara tā, lai ievadītā informācija nekur nesaglabātos, neatkarīgi no pārlūka programmas uzstādījumiem..

Paldies!

<input id="numurs" name="numurs" type="text" autocomplete="off" onchange="ajaxFunction(); this.focus();" />

Parasts cilvēks · August 28, 2010

Paldies, tas otrais strādā...

Bet tas pirmas diemžēl nē :( Tāpat pēc tam jāklikšķina pa jaunu...

briedis · August 28, 2010

Nez, bet fokusam no inputa nevajadzētu pazust tāpat vien pēc kaut kāda eventa izpildes.

P.S. Ieteiktu izmantot jquery, lai nebūtu jāraksta tā milzigā pentere ar kodu. http://api.jquery.com/jQuery.ajax/

mefisto · August 28, 2010

briedis, varbūt vari paskaidrot, kāpēc labāk ir iekļaut milzīgu js bibliotēku, nevis prast uzrakstīt 20 rindiņas ?

briedis · August 28, 2010

briedis, varbūt vari paskaidrot, kāpēc labāk ir iekļaut milzīgu js bibliotēku, nevis prast uzrakstīt 20 rindiņas ?

Tāpēc, ka...

1. Programmētājs ir slinks

2. Drošs pārlūku atbalsts

3. 24 KB mūsdienās neko nemaina (nav problēmas iekļaut googles hostēto versiju, kas noteikti jau ir iekešota)

4. ajax nav vienīgā kur izmantot šo bibliotēku (varbūt autors to apzināsies tikai ar laiku)

5. OP, iespējams, vēl nav apguvis šo bibliotēku, kas nākotnē noteikti ir kā priekšrocība meklējot darbu (maza, bet tik un tā). Varbūt šis gadījums būs kā kickstart's, lai to sāktu izmantot pilnīgāk un izjust visus sniegtos bonusus.

6. kods izskatās smukāks

Lūdzu, pretargumentus :)

Edited August 28, 2010 by briedis

Леший · August 28, 2010

Briedim piekrītīšu, vēl gribu piebilst, ka topika autora kods diez vai ir visa viņa dzīves jēga, gan jau pēc mēnešiem diviem taisīs jau kaut ko sarežģītu un krutu, un tur jau bez JS FW var nošauties.

Parasts cilvēks · August 28, 2010

Paldies...

Mēģināšu izburties caur jQuery

Sign In

Caut Ajax padot input value

Question

Link to comment

Share on other sites

11 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation