Suchergebnisse in ein div jquery und Schienen laden

In meiner Rails App habe ich eine Suchleiste, wo Benutzer andere Benutzer suchen können. Wenn ein Nutzer derzeit die Suche absendet, wird er auf eine Ergebnisseite weitergeleitet. Ich möchte diese Ergebnisse in einem div auf der gleichen Seite laden .. Ich konnte dies mit meinen Websites Navigationslinks tun, aber ich bin ziemlich neu zu jQuery und Schienen und kann dies nicht herausfinden ...Suchergebnisse in ein div jquery und Schienen laden

meine jQuery entsprechend meiner Navigationslinks:

$(function() { 
    $('#links a').live('click', function() { 
     $('#pages').load(this.href).fadeIn('slow'); 
     return false; 
    }); 
});

mein Versuch, das gleiche mit meiner Suchfunktion zu tun ...

$(function() { 
    $("input#search").parents("form").submit(function() { 
    $('#pages').slideUp('slow').load(this.href).slideDown('slow'); 
    return false; 
    }); 
});

jede mögliche Hilfe würde geschätzt ~ werden viel zusammen mit einigen nützlichen jQuery Tutorials für einen Neuling !!

meine Form:

<div id="search_bar"> 
    <form action="/search" method="get"> 
    <input class="tb10" id="search" name="search" onclick="this.select();" type="text" value="Find Users" /> 
    </form> 
</div>

Quelle

2011-01-04 thedeepfield

versuchen return false; in die Suchfunktion auch. Wenn Sie false zurückgeben, wird das Standardereignis für das Element nicht ausgelöst.

Quelle

2011-01-04 06:59:56 sbeam

Ich habe nur ein Test, versuche Alarm ausspucken ('test'), scheint es, als ob jQuery meine Formular-ID nicht findet? In meiner Rails App spezifiziere ich das form_tag mit einem: id => "search" .. mein Formular (eigentlich nur ein Textfeld) hat keinen Submit Button ... um .submit zu benutzen brauche ich einen? – thedeepfield

Wenn '# search' ein' ' Tag identifiziert, dann wird 'submit()' nicht funktionieren, Sie müssen an 'click()' binden. 'submit()' funktioniert nur für '

sbeam hat Recht. Wenn Sie das Suchformular einreichen möchten, können Sie entweder die ID des Formulars ändern oder $ ("input # search") verwenden. Eltern ("form"). Submit(); –

In Ihrem ersten Beispiel binden Sie das Ereignis an einen Anker, der über ein href-Element verfügt, um zu wissen, wo Sie Ihre Links abrufen können.

In der zweiten sieht es so aus, als ob Sie kopiert und eingefügt haben, was für Ihre Links funktionierte. Sie müssen wissen, wo das Formular gerade verarbeitet wird (die Aktion Ihres Formulars) und was ihm als Formulardaten übergeben wird. Dies geschieht, wie in jquery folgt: (I #search gehe davon ist die ID Ihrer Suchformular)

$(function(){ 
    $("#search").submit(function(){ 
     var queryString = $(this).serialize(); //gets the values in your form 
     var url = $(this).attr("action"); //your action url 
     $("#pages").load(url+"?"+queryString).fadeIn('slow'); 
     return false; //this prevents your form from doing its default behavior. 
    }); 
});

ich mit RoR nicht sehr vertraut bin, aber die jquery sollte fest sein :)

Hoffe das hilft!

Quelle

2011-01-04 07:11:20 ehudokai

danke für Ihre Antwort, ja, es war eine Kopie und einfügen.Ich dachte, dass Schienen das ganze Hintergrundmaterial machen würden, und ich kann das HTML einfach umleiten, das Schienen spuckt in ein div. Aus. – thedeepfield

Ich kann Ihnen im Moment kein RoR-Beispiel geben, aber ich denke, die Antwort dreht sich alles um JQuery.

Grundsätzlich sehe ich dies mit einer Ajax-Anfrage, um das Suchergebnis zu erhalten und zeigen Sie das Ergebnis mit einem Templating-System wie Jquery Templates oder Moustache.

wird dieser Ansatz macht es einfacher für Sie die HTML anstatt zu versuchen, erzeugen, um eine Webseite in eine div

JQuery Vorlagen zur Pumpe: http://api.jquery.com/category/plugins/templates/ Schnurrbart für Rails: https://github.com/adamsalter/mustache-rails

Quelle

2011-01-05 01:50:36 AlexCode

hmm ok krankes überprüfen es dank, ich fragte mich was "Schablone" war – thedeepfield

Suchergebnisse in ein div jquery und Schienen laden

Antwort

Verwandte Themen