kostenloser Webspace werbefrei: lima-city


jQuery Links dynamisch erstellen und auslesen

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    webguide

    webguide hat kostenlosen Webspace.

    Hallo

    ich habe ein "altes" Script in PHP, das ich vollkommen auf jQuery umstellen will
    man kann ein Suchwort eingeben und dann über 5 Seiten Ergebnisse blättern

    das mit dem Formular-Eingabe per jQuery (ohne PHP) habe ich hinbekommen,
    aber da ist noch die Auswahl der Seiten (zum Blättern)

    bisher in PHP war es so:
    <div id="pagenavi">
    --- <a href="?q=<?php echo $query_str; ?>&s=1">Seite:1</a> 
    --- <a href="?q=<?php echo $query_str; ?>&s=2">Seite:2</a> 
    --- <a href="?q=<?php echo $query_str; ?>&s=3">Seite:3</a> 
    --- <a href="?q=<?php echo $query_str; ?>&s=4">Seite:4</a> 
    --- <a href="?q=<?php echo $query_str; ?>&s=5">Seite:5</a> 
    </div>


    jetzt suche ich eine Möglichkeit, diese Links dynamisch auch mit jQuery
    zu erstellen und - bei klick - auszuweren,
    also die "neuen" Links müssen gar keine GET-Parameter im href haben
    ich brauche einfach 5 Links mit Nummerierung 1 - 5 und bei Klick
    jeweils die Variable zur ausgewählten Seite (im jQuery)
    damit ich diese dann an die Ausgabe-Funktion übergeben kann

    meine jQuery Ausgabe Funktion rufe ich so auf: run_sx(qstr, page);
    wobei bisher als seite immer "1" übergeben wird,

    $(document).ready(function() { 
    	$("#form1").bind("submit", function() {  
    		var qstr = $("input[name=q]").val(); 
    		var page = 1;  
    
    		run_sx(qstr,page); 
    
    		return false;             
    	});  
    
    });


    also jetzt bräuchte ich was, um anstatt immer nur page = 1;
    je nach Klick auf einen der Seiten-Link
    die jeweilige Seiten-Nr in der Funktion übergeben werden kann

    jemand ne Idee wie ich das bauen könnte (und bei Klick abfragen und übergeben)
    so dass der Query-String (var qstr) nicht verloren geht
    bzw. diesen dann, wenn Klick auf Seiten-Link wieder neu auslesen (aus Formular aber ohne submit)

    Idee ist erstmal so (aber ob das so gut ist !? ... geht bestimmt besser)

    <div id="pagenavi">
    <span style="display:hidden;">Query-String hier wieder auslesen</span>
    --- <a href="#">Seite:1</a>
    --- <a href="#">Seite:2</a>
    --- <a href="#">Seite:3</a>
    --- <a href="#">Seite:4</a>
    --- <a href="#">Seite:5</a>
    </div>


    (EDIT: wobei der span wohl überflüssig ist, weil der qstr ja im Formular input Feld drin steht)

    dann könnte man doch mit
    $("#pagenavi").click(function() { ... });

    bestimmt irgendwie auslesen, der wievielte Link angeklickt wurde für page
    und zudem den span für qstr, damit man beide Werte für Funktionsaufruf hat.

    aber wie machen ... und ... das geht bestimmt besser ;) ?!?



    Beitrag zuletzt geändert: 7.9.2012 19:05:12 von webguide
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. hackyourlife

    Moderator Kostenloser Webspace von hackyourlife

    hackyourlife hat kostenlosen Webspace.

    webguide schrieb:
    Idee ist erstmal so (aber ob das so gut ist !? ... geht bestimmt besser)

    <div id="pagenavi">
    <span style="display:hidden;">Query-String hier wieder auslesen</span>
    --- <a href="#">Seite:1</a>
    --- <a href="#">Seite:2</a>
    --- <a href="#">Seite:3</a>
    --- <a href="#">Seite:4</a>
    --- <a href="#">Seite:5</a>
    </div>


    dann könnte man doch mit
    $("#pagenavi").click(function() { ... });

    bestimmt irgendwie auslesen, der wievielte Link angeklickt wurde für page
    und zudem den span für qstr, damit man beide Werte für Funktionsaufruf hat.

    aber wie machen ... und ... das geht bestimmt besser ;) ?!?

    Sowas ließe sich z.b. so realisieren:
    Du hast eine JavaScript-Funktion, die bei einem Klick auf einen Link aufgerufen wird und als Parameter z.b. die Zahl mitbekommt... also so:
    function klick(page) {
    // mach was mit page
    }
    und
    --- <a href="#" onclick="klick(1);">Seite:1</a>
    --- <a href="#" onclick="klick(2);">Seite:2</a>
    --- <a href="#" onclick="klick(3);">Seite:3</a>
    --- <a href="#" onclick="klick(4);">Seite:4</a>
    --- <a href="#" onclick="klick(5);">Seite:5</a>
    Damit wird bei einem Klick auf einen Link die JavaScript-Funktion "klick" mit dem entsprechenden Parameter aufgerufen.

    webguide schrieb:
    jemand ne Idee wie ich das bauen könnte (und bei Klick abfragen und übergeben)
    so dass der Query-String (var qstr) nicht verloren geht
    bzw. diesen dann, wenn Klick auf Seiten-Link wieder neu auslesen (aus Formular aber ohne submit)
    Query-String? Irgendwie durchblicke ich nicht was du vor hast...

    Was hast du insgesamt mit dem Formular (form1) vor?
  4. Autor dieses Themas

    webguide

    webguide hat kostenlosen Webspace.

    Hallo

    im Formular id="form1" ist (bis jetzt) nur ein Feld (text input) für "Suchwort" = Query String

    es soll aber evtl noch ein DropDown Feld hinzukommen

    ... das mit onclick= im Link geht zwar, ich würde aber gern im Quellcode darauf verzichten,
    wenn ich schon jQuery geladen habe, sollte es doch auch damit gehen
    damit kann man doch sicher aus einem Element <div id="pagenavi">
    bei KLick auf eines seiner Kinder <a ...> ermitteln, das wievielte Kind geklickt wurde

    ... habs sogar rausgefunden ... :)
    $(document).ready(function() { 
    	$('#pagenavi a').click(function(){ 
    		var page = ($('#pagenavi a').index(this) + 1); 
    		alert( "Seite: "+ page +" wurde geklickt." );
    	});
    });


    also das wäre so ok, ... jetzt noch das Drop-Down-Feld rein friemeln :)

    ... auch das hab ich glaube ich hinbekommen

    HTML (im Formular)
    <select name="kat">
    	<option value="0">Alle Kategorien</option>
    	<option value="1">Kategorie A</option>
    	<option value="2">Kategorie B</option>
    	<option value="3">Kategorie C</option>
    </select>


    und der JS Code ....

    var katv = $("select[name=kat] option:selected").val();   // --- Value 
    var katx = $("select[name=kat] option:selected").text();  // --- Text


    klappt ganz gut so :)


    Beitrag zuletzt geändert: 7.9.2012 20:48:18 von webguide
  5. Unabhängig von der Art und Weise, wie Du das jetzt mit jQuery umsetzen kannst, sehe ich einen entscheidenden Nachteil bei der Idee und den gewählten Lösungsansätzen: Weder Barrierefreiheit, noch Nutzbarkeit für User ohne Javascript, oder auch simples Bookmarking einer Unterseite sind noch möglich, wenn der Seitenparameter nicht in der URL übergeben wird.
  6. Autor dieses Themas

    webguide

    webguide hat kostenlosen Webspace.

    ja, das ist ein Problem, keine Parameter in URLs, auch für Suchmaschinen (SEO)
    aber welcher User hat denn heutzutage kein JS aktiviert ?
    ... sehr viele Seiten nutzen doch JS / jQuery / prototype / etc. .. auch (besonders) die "großen"

    Das Problem ist, es soll auf einem Webspace, bei dem allow_url_fopen = OFF ist
    trotzdem von externer (remote) API gelesen werden soll, dazu nehme ich jQuery ajax jsonp
    ... was die einzige (mir bekannte) Möglichkeit ist, um (JSON) Daten
    von einem fremden (remote) Server abzuholen. ohne allow_url_fopen (mit JS)

    da ich also schon im jQuery-Fieber war, dachte ich, dann mach ich gleich alles damit
    ... auch weil ich ja die Parameter wieder als JS-Funktionen übergeben will / muss

    Aber du hast Recht, ohne URL-Parameter (evtl sogar als rewrite URLs)
    ist das ein großer Nachteil, wegen Deeplinks, Bookmarking, SiteMap, etc.

    ... ich sollte also die Formular-Übergabe und Seiten-Auswahl
    doch "normal" machen (Parameter per PHP $_GET auswerten)
    und bei Aufruf der Seite dann diese Parameter an die Funktion übergeben

    :( schade .. jetzt war ich grad so froh, das ich es mit jQuery so hinbekommen habe,
    jetzt ist das doch nix .... also wieder umbauen ... Variable aus PHP an JS übergeben

  7. hackyourlife

    Moderator Kostenloser Webspace von hackyourlife

    hackyourlife hat kostenlosen Webspace.

    webguide schrieb:
    ... sehr viele Seiten nutzen doch JS / jQuery / prototype / etc. .. auch (besonders) die "großen"
    Aber: diese Seiten funktionieren auch dann noch, wenn JavaScript deaktiviert wurde.

    webguide schrieb:
    ... ich sollte also die Formular-Übergabe und Seiten-Auswahl
    doch "normal" machen (Parameter per PHP $_GET auswerten)
    und bei Aufruf der Seite dann diese Parameter an die Funktion übergeben
    Nichts da! Du kennst bestimmt hier auf lima-city die Tabs bei der Hilfe oder wenn du dir ein Profil ansiehst? Dort wird eine Möglichkeit gezeigt wie du das mit dem Bookmarkbar-machen erreichen kannst... dazu noch kurz der Ansatz:
    Die URL stellt nicht zu 100% etwas dar, was an den Server gesendet wird. Alles nach dem
    #
    wird vom Browser ausgewertet und dazu benutzt um zu markierten Stellen auf der Seite zu springen. Dieser Mechanismus kann von JavaScript genutzt werden um etwas an die URL anzuhängen was nicht vom Server ausgewertet wird... und das lässt sich auch wieder einlesen und auswerten. Damit lassen sich deine bookmarkbaren Seiten realisieren.

    Beitrag zuletzt geändert: 8.9.2012 10:30:55 von hackyourlife
  8. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!