Opet problem se spojenim formulare s AJAXEM
- pjoter
- Člen | 118
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
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
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
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
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
// 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)
- hiny
- Člen | 35
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]