Opet problem se spojenim formulare s AJAXEM

Upozornění: Tohle vlákno je hodně staré a informace nemusí být platné pro současné Nette.
pjoter
Člen | 118
+
0
-

Zdravim,
i kdyz jsem nekolikrat procetl a vyzkosel topic na toto tema stale to nemohu zprovoznit. Procetl jsem i nektere dalsi prispevky a pokusil se opravit chyby ale stale nic.
Pozn. formular vykresluju manualne.

Co chci udelat ?

po vyberu vyrobce v selectboxy id_vyrobce chci nacist data do selectboxu id_model podle hodnoty z id_vyrobce.

Co jsem udelal ?

EDIT:po vyberu vyrobce se povoli model ovsem je prazdny :(

Poradi mi prosim nekdo jak na to ? Jsem Nette/AJAX zacatecnik.

<?php
	public function renderAdd()
	{
		$this->template->form = $this['poptavkaForm'];

	}

?>

pri tvorbe formulare v tovarnicce tak trochu nechapu vyznam vetve if ($form->isSubmitted()) { jako by se ty selecty meli plnit dvakrat.

<?php
	protected function createComponentPoptavkaForm($name)
	{

		$form = new AppForm($this, $name);

		$form->addProtection();

		$formData = $this->getSelects();


		$form->addSelect('id_vyrobce', 'Výrobce');
		$form->addSelect('id_model', 'Model');

		$form['id_vyrobce']->getControlPrototype()
			->onchange('loadBox(1, this.value);');
		$form['id_model']->getControlPrototype()
			->onchange('loadBox(2, this.value);');

		$form->addSubmit('submit1', '')
			->onClick[] = array($this, 'okClicked');

		$form['id_vyrobce']->setItems($this->db->query('SELECT id_vyrobce,nazev_vyrobce FROM vyrobce')->fetchPairs('id_vyrobce', 'nazev_vyrobce'));


		if ($form->isSubmitted()) {
			// teprve nyni dosadime hodnoty
			$form['id_model']->setItems($this->db->query('SELECT id_model,nazev_model FROM model')->fetchPairs('id_model', 'nazev_model'));
		} else {
			$form['id_model']->setDisabled();
			$form['submit1']->setDisabled();
		}


		return $form;
	}
?>
<?php
	public function handleLoadData($phase, $value)
	{
		$this->template->form = $this['poptavkaForm'];

		$form = $this->template->form;

		if ($phase == 1) {
			// naplníme select box prvky a vypíšeme na výstup
			$form['id_model']->setItems($this->db->query('SELECT id_model,nazev_model FROM model WHERE id_vyrobce = '.$value)->fetchPairs('id_model', 'nazev_model'))
			->setDisabled(false);
			echo $form['id_model']->getControl();
		}

		// konec zpracování
		$this->terminate();
	}
?>

(samozrejme v layoutu nacitam script jquery oba jsou v document_root/js/)

<script src=„js/jquery.js“ type=„text/javascript“></script>
<script src=„js/jquery.nette.js“ type=„text/javascript“></script>

a nakonec script ktery je pred form v sablone

<script type="text/javascript">
function loadBox(phase, value)
{
        if (phase === 1) {
                // zvolena hodnota prvniho select boxu
                $('#frmpoptavkaForm-id_model').attr('disabled', false);
                $('#frmpoptavkaForm-submit1').attr('disabled', true);

                // zobrazi symbol, že se něco načítá
                //spinner();

                // natáhne obsah druhého selectboxu pomocí AJAXu
                $.get("?do=loadData", {"phase": phase, "value": value}, function(data) {
                        // Nevím proč, ale tohle mi nefunguje
                        // $('#frmpoptavkaForm-id_model').parent().html(data);
                        // me ale nefunguje ani tohle
                        document.getElementById('id_model').innerHTML=data;
                });

        } else if (phase === 2) {
                // zvolena hodnota druheho select boxu, povolí tlačítko submit
                $('#frmpoptavkaForm-submit1').attr('disabled', false);
        }
}
</script>

Editoval pjoter (20. 10. 2009 15:08)

hiny
Člen | 35
+
0
-

Ahoj, zrovna sem teď řešil něco podobného a když se na to zběžně podívám, tak dle tvého popisu vidím hlavní problém v JS části.

<script type="text/javascript">
function loadBox(phase, value)
{
        if (phase === 1) {
                // zvolena hodnota prvniho select boxu

		// Tohle tu asi nemá být
                // $('#frmpoptavkaForm-id_vyrobce').attr('disabled', true);
		// teda nevím co tím zamýšlíš, ale minimálně následující řádek nemá smysl
                // $('#frmpoptavkaForm-id_vyrobce').val(0);

		// Tady musíš povolit select box id_model
		$('#frmpoptavkaForm-id_model').attr('disabled', false);
                $('#frmpoptavkaForm-id_model').val(0);

                $('#frmpoptavkaForm-submit1').attr('disabled', true);

                // zobrazi symbol, že se něco načítá
                //spinner();

                // natáhne obsah druhého selectboxu pomocí AJAXu
                $.get("?do=loadData", {"phase": phase, "value": value}, function(data) {
			// Nevím proč, ale tohle mi nefunguje
                        // $('#frmpoptavkaForm-id_model').parent().html(data);
			// takže sem nakonec použil toto a vše je OK
			document.getElementById('id_model').innerHTML=data;
                });

        } else if (phase === 2) {
                // zvolena hodnota druheho select boxu, povolí tlačítko submit
                $('#frmpoptavkaForm-submit1').attr('disabled', false);
        }
}
</script>
pjoter
Člen | 118
+
0
-

upravil jsem to ale porad to neni ono (kod v prvnim prispevku je aktualni) po vybrani vyrobce se povoli model ale je prazdny.

Pritom jsem zkousel dat v prohlizeci natvrdo url ?do=loadData&phase=1&value=2 a zobrazil se mi cely select box ktery by mel.

Citim ze uz jsem blizko ale pritom tak daleko :) please help

hiny
Člen | 35
+
0
-

Omlouvám se, zapoměl sem dodat ještě malou drobnost ohledně jednoho divu navíc.

document.getElementById('id_model').innerHTML=data;

je vlastně přímá náhrada za

$('#frmpoptavkaForm-id_model').parent().html(data);

který mi vyhazoval chybu

Ale pouze s předpokladem, že daný select(#frmpoptavkaForm-id_model) je obalen, ještě v dalším divu s id „id_model“.

pjoter
Člen | 118
+
0
-

hiny napsal(a):

Ale pouze s předpokladem, že daný select(#frmpoptavkaForm-id_model) je obalen, ještě v dalším divu s id „id_model“.

select neni obalen ale vypada to ze je problem s tim volanim fce:

<script>
                $.get("?do=loadData", {"phase": phase, "value": value}, function(data) {
                        // Nevím proč, ale tohle mi nefunguje
                        $('#frmpoptavkaForm-id_model').parent().html(data);


			// Například když tu napíšu:
			alert("nefunguje tooo");

			// Tak se zadny alert nezobrazi
                });
</script>
hiny
Člen | 35
+
0
-

// Například když tu napíšu:
alert(„nefunguje tooo“);

To by mělo fungovat, když si to doplním do toho svého skriptu, tak to na mě vyskočí.

Hlasí FireBug nebo alespoň chybova konzole firefoxu, nějaký problém s javascriptem?

EDIT:

Teď sem si všiml, že používáš $('#frmpoptavkaForm-id_model').parent().html(data);

Když toto použiju, tak mi to vyhodí následující chybu a místo selectboxu mám prázdné místo.

Chyba: uncaught exception: [Exception… „Could not convert JavaScript argument arg 0“ nsresult: „0×80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)“ location: „JS frame :: http://localhost/js/jquery.js :: anonymous :: line 12“ data: no]

Z tohoto důvodu to obchazím použitím document.getElementById('id_model').innerHTML=data; a přidáním jednoho divu #id_model kolem toho selectboxu navíc do šablony.

Pokud přidáš tento div a upravíš JS, tak ti to poběží.

Editoval hiny (20. 10. 2009 16:17)

pjoter
Člen | 118
+
0
-

tak jsem vyzkousel to s tim divem tak to sice funguje ale jen ve firefoxu, ie my tam misto selectu napise [object Object], a chrome jen prazdny select box.

hiny
Člen | 35
+
0
-

pjoter napsal(a):

tak kdyz jsem to vyzkousel ve firebugu tak jsem zjistil ze on ten select id_model cely vymaze a nenahradi ho nicim

EDIT: tak jsem vyzkousel to s tim divem tak to sice funguje ale jen ve firefoxu, ie my tam misto selectu napise [object Object], a chrome jen prazdny select box.

Tak to máš pravdu, po těch změnách sem to, doposud v jiných prohlížečích nezkoušel. Jak IE,Chrome tak i Opera se mi chovaji stejně. A to tak, že pouze povolí daný selectbox.

Takže by mne samotného docela teď zajímalo, co přesně znamená ta chyba v chybové konzoli Firefoxu:

Chyba: uncaught exception: [Exception… „Could not convert JavaScript argument arg 0“ nsresult: „0×80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)“ location: „JS frame :: http://localhost/js/jquery.js :: anonymous :: line 12“ data: no]

pjoter
Člen | 118
+
0
-

Tak me uz to jede bylo to tim ze sem mel globalne nastaveno data-type na JSON

staci zakomentovat radek v jquery.nette.js

hiny
Člen | 35
+
0
-

pjoter napsal(a):

Tak me uz to jede bylo to tim ze sem mel globalne nastaveno data-type na JSON

staci zakomentovat radek v jquery.nette.js

Díky za info.