Něco jako nette.js s jQuery
- Jan Tvrdík
- Nette guru | 2595
cuga napsal(a):
to Tomik:
chtel bych se zeptat, u toho uploadify, co jsi nastavil jako script? Nechal jsi ten jejich upload.php nebo jsi to nejak provazal s nette?
Neměl by být problém to nastavit na
{plink uploadHandlerNeboTakNeco}
.
- Tomik
- Nette Evangelist | 485
Měl bych ještě dotaz ohledně javascriptu, nette.js a jQuery, asi na Honzu Marka:
Něž jsem nasadil AJAX a jQuery používal jsem něco ve
stylu:
<a href="{link delete! $file['url']}" onclick="if (!confirm('Opravdu chcete tento soubor smazat?')) return false;">del</a>
Jenže když jsem nadadil AJAXOVÁNÍ s jQuery, tedy:
<a href="{link delete! $file['url']}" {if $useAjax}class="ajaxlink"{/if} onclick="if (!confirm('Opravdu chcete tento soubor smazat?')) return false;">del</a>
Událost click
se na daném odkazu (pokud je zapnutý js)
provede, ať už je návratová hodnota confirm
jakákoli. Tj.
jQuery
„přebije“ tu část v onclicku
return false
.
Dotaz zní: jde nějak toto ovlivnit, tak abych měl možnost uživatel zadat ANO/NE a jQuery na to brala ohled?
Dík!
- cuga
- Člen | 210
asi budu potrebovat nakopnout jeste trosku :)
protoze i kdyz jsem dal {plink uploadHandler} a po chvilce pokusu prekopiroval obsah jejich souboru do teto metody, tak furt nic… hlavne mi neni jasne jak predavat prenasene soubory metode v presenteru…
da se jinak nez pres $_FILES dostat v nette k souborum???
Editoval cuga (12. 5. 2009 23:07)
- Honza Marek
- Člen | 1664
cuga: Environment::getHttpRequest()->getFiles() nebo tak něco
Tomik: teď nevim. Při nejhorším to půjde označit nějakou speciální třídou a dát
$(el).click(function () {
if (confirm(...)) {
$.get(this.href);
}
return false;
});
- cuga
- Člen | 210
Kurnik, tak zatim zadny pokrok.
Konfiguraci mam:
<script type="text/javascript">
$(document).ready(function() {
$('#frmform-images').fileUpload ({
'uploader' : '{!$baseUri}js/uploadify/uploader.swf',
'script' : {plink uploadHandler},
'cancelImg' : '{!$baseUri}js/uploadify/cancel.png',
'auto' : false,
'folder' : '{!$baseUri}upload/products/{$id}',
'multi' : true
});
});
</script>
Kod mam:
public function uploadHandler() {
$id = $this->getParam('id');
$uploadDir = 'upload/products/'.$id;
$files = Environment::getHttpRequest()->getFiles();
foreach($files as $file) {
if($file->isOk()) {
if(!is_dir($uploadDir)) {
mkdir($uploadDir, 0755, true);
}
$file->move($uploadDir."/".$file->getName());
}
}
}
Nedojde ani k vytvoreni adresare. I kdyz jsem vyhodil podminku $file->isOk() tak k nemu nedoslo, takze je otazka, jestli vubec dojde k volani uploadHandleru.
Editoval cuga (13. 5. 2009 12:04)
- Honza Kuchař
- Člen | 1662
bajzic napsal(a):
Ahoj,
mám problém. Nedaří se mi tímto způsobem (AJAX formuláře) uploadnout soubor… Používám aktuální zdrojáky od Honzy M., všechno běží, ale soubor nikde, jeho hodnota z formuláře je prázdná.
Někomu z vás to funguje?
Přes JavaScript nemůžeš posílat soubory, pokud vím. Ale zkus uploadify plugin. (do jQuery) Umožní ti uploadovat i více souborů naráz.
//Edit: Ještě odkaz: http://www.uploadify.com/
Editoval honzakuchar (14. 5. 2009 17:19)
- _Martin_
- Generous Backer | 679
cuga napsal(a):
Ja sem si to taky zprovoznil :)
Akorat sem pro to musel udelat presenter, ktery nekontroluje prihlaseni uzivatele…
Jak on vlastně ten plugin funguje? On požadavek na server vede skrze ten flashový soubor? Protože jestli je problém s ověřením přihlášení, tak se nejspíš v tom požadavku neodešle session ID.
- Mas3r
- Člen | 116
Zdravím po delší době. Předem díky za super jQuery knihovničky pro AJAX. A teď k věci. AXAJ se mi krásně podařilo zprovoznit při kliku na odkaz, ale bohužel nevalí to při odeslání formu.
Do stránky jsem vložil všechny potřebné soubory… jquery.ajaxform.js
tam je.
Pak jsem také vložil:
<script>
// po načtení stránky
$(function () {
// odeslání na formulářích
$("form").submit(function () {
$(this).ajaxSubmit();
return false;
});
// odeslání pomocí tlačítek
$("form :submit").click(function () {
$(this).ajaxSubmit();
return false;
});
});
</script>
Ale žádný form to nebere. Ve firebugu se nezobrazí žádný POST jako je to u odkazů. Jede vám to? Díky za odpověď
- Honza Marek
- Člen | 1664
Valí. Jediné, co mě napadá je, že třeba máš ty formuláře ve snippetu a v okamžiku načtení stránky ještě neexistují, takže nejsou zajaxovány.
- Honza Marek
- Člen | 1664
Tipuju, že v php máš reload. A submitovat musíš na submitovacím
tlačítku nebo formuláři. Takže něco
jako $(".checkbox").parents("form").submit()
- Mas3r
- Člen | 116
Co myslíš tím „v PHP reload?“. Normálně přes onSubmit[] přejdu na fci, ve které uložím do DB a pak mám redirect.
<script>
// odeslání pomocí checkboxu
$("form :checkbox").click(function () {
$(this).parents("form").submit();
return false;
});
</script>
Tak AJAX se spustí, ale zase to refreshne celou stránku. Nemělo by tam být něco jako preventDefault()?
Editoval Mas3r (6. 6. 2009 21:41)
- morousej
- Člen | 18
Mas3r napsal(a):
Co myslíš tím „v PHP reload?“. Normálně přes onSubmit[] přejdu na fci, ve které uložím do DB a pak mám redirect.
V ajaxovém módu neměj redirect – způsobí překreslení celé stránky. Viz http://zdrojak.root.cz/…mework-ajax/.
- Mas3r
- Člen | 116
To jsem nevěděl. Díky. Už to skoro pracuje jak má :) Jen taaková menší drobnost. Nejspíše protože je to přes signál, tak se nejdříve provede metoda, která mi vykreslí ty checkboxy a až pak se provede signál. Jenže toto pořadí zapřičiní, že se checkboxy nepřekreslí (jen při manuálním refreshi). Nevíte ještě jak na toto?
=======
Moje chyba, stačilo změnit z prepare na render! Možná to někomu pomůže. Díky všem.
Editoval Mas3r (6. 6. 2009 22:08)
- Mas3r
- Člen | 116
Honza M. napsal(a):
Valí. Jediné, co mě napadá je, že třeba máš ty formuláře ve snippetu a v okamžiku načtení stránky ještě neexistují, takže nejsou zajaxovány.
Ještě jsem narazil na takový problém. Mám snippet, v něm další snippet a v něm třeba další. Nebyl by problém do každého nakopírovat <script> kvůli tomu formuláři, ale když to udělám, tak ty requesty se provedou vícekrát. Nemáš na to nějaký fígl?
- Mas3r
- Člen | 116
Tak jsem zkusil…
<script>
// po načtení stránky
$(function () {
// odeslání na formulářích
$("form.ajax").livequery("submit", function () {
$(this).ajaxSubmit();
return false;
});
// odeslání pomocí tlačítek
$("form.ajax :submit").livequery("click", function () {
$(this).ajaxSubmit();
return false;
});
// odeslání pomocí checkboxu
$("form.ajax :checkbox").livequery("click", function () {
$(this).parents("form").submit();
return false;
});
});
</script>
Po refreshi stránky to jede, ale jakmile překreslím jakýkolik snippet, tak to nevalí.
- Honza Marek
- Člen | 1664
Divné… jinak není potřeba to mít v tom $(fnc () { … }), ale to by nemělo ani vadit.
- marek.dusek
- Člen | 99
jen technicka, koukam v kodu je neco jako „form = this“ a pak uz se jen returnuje atd. – nedela to memory leaky v IE?
- jarks
- Člen | 94
Věděl by prosím někdo co dělat s tím, že se zapnutým ajaxem
nefunguje dotazování onclick
? Pokud je v šabloně toto
<a href="{link deleteItem! $i->id}" onclick="return confirm('Skutečně odebrat položku {$i->name}?')" class="ajax">smazat</a>
akce se provede, ať uživatel odpoví jakkoliv.
Něco podobného jsem tu našel, ale nevím, jak navrhované řešení použít.
- Panda
- Člen | 569
Hm, zrovna dneska jsem to taky potřeboval a taky jsem nad tím musel kousek meditovat… Řešení jde trošku oklikou:
var e = $.Event(event); if (!confirm('Opravdu chcete odstranit tento blok?')) e.stopImmediatePropagation(); e.preventDefault();
Pro více informací o řešení doporučuji juknout na dokumentaci k jQuery.Event.
- Ondřej Mirtes
- Člen | 1536
Já to vyřešil takto:
$("a.confirm").live("click", function(event) {
event.preventDefault();
if (confirm("Jste si jisti?")) $.get(this.href);
});
Editoval LastHunter (26. 8. 2009 19:54)
- DocX
- Člen | 154
Ahoj, narazil jsem na problém s jquery.ajaxform.js
.
Když mám formulář s více tlačítky, tak se validace provádí na
onclick
daného tlačítka a už na na onsubmit
celého formuláře. Při kliku se pak nejprve spustí validace na
onclick
a nezávisle na jejím výsledku se spustí
ajaxSubmit
, který je na něj připojen pomcí liveQuery, jako
v tomto příkladě:
$("form.ajax :submit").livequery("click", function(event) {
$(this).ajaxSubmit();
return false;
});
Způsobí to to, že formulář při špatné validaci ukáže
alert
se zprávou o chybě. Zpracovávání se ale nezastaví a
nezávisle na špatné validaci spustí ajaxSubmit a odešle se přes ajax a
zobrazí chybu vygenerovanou v PHP.
Vyřešil jsem to „přesměrováním“ onclick
handlerů ze
submit tlačítek:
$("form.ajax :submit").livequery(function () {
this.oldonclick = this.onclick;
this.onclick = null;
$(this).click(function() {
if ($.isFunction(this.oldonclick) && !this.oldonclick())
return false;
$(this).ajaxSubmit();
return false;
});
}, function () {});
//Edit: trochu vylepšená formulace myšlenky ;)
Editoval DocX (22. 9. 2009 16:06)
- Honza Kuchař
- Člen | 1662
pokud myslíš flash message, tak v @layout.phtml:
{snippet flashes}
<div class="flash {$flash->type}" n:foreach="$flashes as $flash">{$flash->message}</div>
{/snippet}
v base presenteru:
/**
* Saves the message to template, that can be displayed after redirect.
* @param string
* @param string
* @return stdClass
*/
public function flashMessage($message, $type = 'info') {
$this->invalidateControl("flashes");
parent::flashMessage($message, $type);
}
- wotaen
- Člen | 82
Promiň Honzo, psal jsem to ve spěchu. Myslel jsem to tak, že
v komponentě zpracovávám submit formuláře metodou sendEmail. A ten
formulář se odesílá „ajaxově“, můžu to pořešit pomocí HTTP
statusů a callbacku v javascriptu, ale to nechci, třebas už jenom s ohledem
na lokalizace, které by se blbě dělaly v JS.
Můžu mít persistentní proměnnou, která se mi bude vracet klientovi, ale to
se mi taky moc nelíbí. Spíš nějakou strukturu s return kódem a zprávou,
tak ať na to může JS reagovat.
Už to píšu doma, braindead, tak třeba něco zítra vymyslím.
- Honza Kuchař
- Člen | 1662
Stále nechápu co chceš, ale pokud chceš předat něco klientovi AJAXem (v JSON), tak na to je tohle
$presenter->payload;
$presenter->payload->mojedata = "test"; // Tohle se pošle AJAXem klientovi
- JakubKohout
- Člen | 92
Snažím se zkombinovat jquery.nette s našeptávačem kterej je k nalezení zde problém je ovšem v
jQuery.ajaxSetup({
success: jQuery.nette.success,
dataType: "json"
});
který znefunkční celý našeptáváč … Nějakej nápad jak to upravit ?
- Honza Marek
- Člen | 1664
Problém bude v tom přednastavení návratového datového typu na JSON. Čili buď explicitně nastavit u ajaxových požadavků našeptávače datový typ, který potřebuje, nebo naopak zrušit defaultní nastavení JSONu a pak u ajaxu od nette vždy lokálně nastavit ten typ zase na JSON. Například místo $.get použít $.getJSON apod…
- JakubKohout
- Člen | 92
tim to podle mě nebude protože samotnej má nastaven dataType: options.dataType, a i když to změním na dataType: „text“, tak to stejně nefunguje.
Chyba musí být někde jinde…A co se týče odpovědi od serveru ta je v podobě text/html
mimojiné: nemáte někdo nějakej hezkej příkládek jak nastavit jquery.ajaxform a jquery.nette? mám v nich trošku bordel nevím co kterej dělá a nepočítaje to že když do formulářů vložím tu ukázku z toho točítka tak přestane fungovat ajax ale zase se točí :/
Editoval dRaGen (12. 10. 2009 18:38)
- Honza Marek
- Člen | 1664
jquery.nette zajišťuje, že ajaxové dotazy mají nastaven nějaký defaultní callback a datový typ, takže potom fungují snippety a přesměrování. jquery.ajaxform umožňuje odesílat formulář ajaxově a teoreticky by měl být na jquery.nette nezávislý.