Facebook like vyhledávání Jquery

Dawerx

Ahoj.

Nikde jsem to na fóru nenašel tak píšu sem.

Mám tento skript.

searchInput.live('keyup', function(searchText) {

    var results = $(".result");
    results.text("There are gonna be results");
    results.slideDown("fast");


});

A chtěl bych spustit akci v presenteru, která vytáhne z DB všechny výsledky podle parametru searchText.
A nějak nevím jak spustit v jquery tu akci presenteru. Ty výsledky pak hodlám vypsat do divu s výsledky. Jde mi o to aby se výsledky aktualizovali po každém stisku klávesy. Pokud mi někdo poradíte, nebo mě někam odkážete budu rád.

P.S. Nechci použít našeptávač, protože s výsledky chci zobrazovat i obrázek, tak jak funguje vyhledávání na Facebooku.

Děkuji :)

Editoval Dawerx (22. 8. 2012 12:10)

22

AJAX

Editoval 22 (22. 8. 2012 12:29)

Dawerx

22 napsal(a):

AJAX

Četl jsem, ale zkusím to ještě jednou… :)

Dawerx

Tak můj dotaz změnil podobu, jak můžu spustit určitý handle presenteru ze šablony v JQuery prosím? Našel jsem pár návodů, ale ty mi nefungovaly.

Díky.

Ot@s

22tka už Ti psala odpověd. Zkus nejjednodušší ukázku ajaxu v Nette:
Šablona presenteru/akce

<!-- v @layout.latte includuj knihovny: jQuery a jquery.nette.js -->
{snippet flashmessage}
<div n:foreach="$flashes as $flash">{$flash->message}</div>
{/snippet}
<p><a n:href="ChciTo!" class="ajax">Vyvolej signál</a> z presenteru!</p>

Presenter

public function handleChciTo() {
	// tady udelas co potrebujes
	$this->flashMessage('Signal z presenteru proveden!');
	if ($this->isAjax()) $this->invalidateControl('flashmessage');
	else $this->redirect('this');
}

EDIT: onen class="ajax" ti prostřednictvím JS knihovny jquery.nette.js zajistí maximální zjednodušení používání ajaxu v Nette (a úplně na pozadí všeho jQuery)

Editoval Ot@s (24. 8. 2012 10:09)

Tomáš Votruba

@Dawerx: Třeba nějak takto

	$.get("?do=liveSearch", {"s": $(this).val()});

Zpracování

public function handleLiveSearch($s)
{
	// ...
	$this->invalidateControl("...");
}

Dawerx

@Ot@s
Takto na kliknutí mi to funguje v tom není problém, nicméně i tak díky za radu :)

@Schmutzka
Toto jsem právě našel, ale nevím proč, nefunguje mi to, skript je přímo v šabloně, není v externím souboru (Říkám to jen pro jistotu). I přesto děkuji. Tohle je první věc se kterou si v Nette nevím rady… =/

Ot@s

Dawerx napsal(a):

@Ot@s
Takto na kliknutí mi to funguje v tom není problém, nicméně i tak díky za radu :)

Já to hned nepochopil :-)

@Schmutzka
Toto jsem právě našel, ale nevím proč, nefunguje mi to, skript je přímo v šabloně, není v externím souboru (Říkám to jen pro jistotu). I přesto děkuji. Tohle je první věc se kterou si v Nette nevím rady… =/

Nefunguje znamené žádné JS chyby a žádné změny ve stránce? Nebo jak? Pokud jde jen o ty neprojevující se snippety, tak tam chybí callback na promítnutí změn do DOMu:

$.post("?do=liveSearch", function(data) {
	$.nette.success(data);
});

Dawerx

zkusil jsem firebug, ten vypisuje, že se vše provedlo, ale flashmessage se nevykreslil. InvalidateControl tam je. Tak nevím čím to…

Ot@s

Dawerx napsal(a):

zkusil jsem firebug, ten vypisuje, že se vše provedlo, ale flashmessage se nevykreslil. InvalidateControl tam je. Tak nevím čím to…

Jestli se nikde nevypisuje JS chyba a v odpovědi serveru je neprázdný JSON, tak tam chybí něco, co vrácený JSON promítne do HTML, tj. callback po requestu na server ($.nette.success(data);, viz. výše). Zkušel jsi to?

Editoval Ot@s (24. 8. 2012 12:46)

Dawerx

Děkuji za pomoc už se mi to s kamarádem podařilo vyřešit. Takto, dost podobné tomu, co jsi říkal.

$.get("?do=search", {"item": valueOfInput}, function(data){

      $(".result").html(data);

   });