Autor | Zpráva | ||
---|---|---|---|
leorond Profil |
#1 · Zasláno: 13. 8. 2016, 14:45:39
Ahoj, chtěl bych se dozvědět více o Ajax a to konkrétně o stránkování.
Nikde jsem nenašel článek jak toto stránkování vytvořit, tedy pokud nepočítám nette. Jediné co jsem našel v jedné diskuzi je již hotový script který prý dobře funguje ale jak dál, když nevím jak má vypadat HTML kód? Script pro stránkování jQuery('.results-filter a').live('click', function(e){ e.preventDefault(); var link = jQuery(this).attr('href'); jQuery('.ajax').fadeOut(500, function(){ Cufon.refresh(); //obnovit cufon font jQuery('.loader').show(); }).load(link + ' .results', function(){ jQuery('.ajax').fadeIn(500, function(){ jQuery('.loader').fadeOut(800); }); }); }); Dokázal by jste mi někdo poradit a trochu popsat script? Moc děkuji za reakce |
||
Michales Profil |
#2 · Zasláno: 13. 8. 2016, 15:01:51
leorond:
„Nikde jsem nenašel článek jak toto stránkování vytvořit“ Tak špatně hledáš: lmgtfy.com/?q=ajax+pagination&l=1 |
||
leorond Profil |
#3 · Zasláno: 13. 8. 2016, 18:12:03
Michales: Děkuji
No ještě najít něco co by mi fungovalo, jako například nekonečné stránkování, všude je HTML kód a JS ale to co by mi fungovalo tak je pro mne nepoužitelné a z informací získaných na těch webech vím jen že to mám zkopírovat. |
||
leorond Profil |
Ano tak už 2 dny a stále žádné fungující řešení jsem nenašel
Ztráta času |
||
martin1312 Profil |
#5 · Zasláno: 15. 8. 2016, 06:34:39
leorond:
Michales ti poradil, hneď prvý odkaz www.sanwebe.com/2013/03/ajax-pagination-with-jquery-php popisuje kód JS aj PHP, dole je aj demo ukážka. Čo sa ti nepáči napríklad na tomto? Ak chceš pochopiť kód, googli si jednotlivé funkcie a pozri sa, čo robia. |
||
leorond Profil |
#6 · Zasláno: 15. 8. 2016, 07:17:26
martin1312: Je to OOP kterému já nerozumím
|
||
Keeehi Profil |
#7 · Zasláno: 15. 8. 2016, 07:48:51
leorond:
OOP to opravdu není. Objekt se tam sice vyskytuje ale je to jen pro práci s databází. Nic extrémně složitého. Navíc všechny metody mají své procedurální ekvivalenty, které se jmenují úplně stejně. Takže pokud bys to tak nutně potřeboval, šlo by se toho objektu velmi lehce zbavit. |
||
leorond Profil |
#8 · Zasláno: 15. 8. 2016, 08:06:39
Pánové můj článek začíná Ahoj, chtěl bych se dozvědět více o Ajax a to konkrétně o stránkování.
Nezačíná Chci nutně na svůj web stránkování hoďte mi někdo hotové řešení Učil jsem se 14 let němčinu ale anglicky umím maximálně rukama nohama. No příště půjdu radši na stránky google než sem abych se dozvěděl že mám jít na google odborníci na slovo vzatí |
||
Michales Profil |
leorond:
„Pánové můj článek začíná Ahoj, chtěl bych se dozvědět více o Ajax a to konkrétně o stránkování.“ Ano to máš pravdu, zároveň si také psal že: „Nikde jsem nenašel článek jak toto stránkování vytvořit, tedy pokud nepočítám nette.“ takže jsem za tebe na google vyhledal články s touto tématikou, kde se to podrobně rozebírá. „Učil jsem se 14 let němčinu ale anglicky umím maximálně rukama nohama.“ Tohle už přeci není problém zdejší diskuze. Pro další vývoj v programování a pochopení scriptů bude angličtina velmi potřebná. Takže závěrem shrnutí co si pro to ty sám udělal? Vůbec nic. Dostal si odpověď na svou otázku a ještě se zlobíš. možná se najde někdo kdo ti tu bude celou procedůru ajaxu vysvětlovat ale celkem proč, když článků je o tom stovky. |
||
leorond Profil |
To je pravda ale v tom případě nevím proč existuje fórum které má sekci JavaScript když ho od tud pošlou hledat do google to mi drásá nervy!
Kdybych chtěl odpověď najít na googlu tak tady ani nic nepíšu ale bohužel se prostě musím smířit s tím že psát sem byla ztráta času a né snažit se zprovoznit demo stránkování které někdo vytvořil nebo od někoho zkopíroval, jelikož místo toho aby mi někdo vysvětlil základ ( což by někomu kdo to umí zabralo 5 minut psaní ) tak mne radši odkážou na google a to se pánové vyplatí taková rada je k nezaplacení. Michales, [#9] a ještě k tomuto, nepleť si jak ho vytvořit s jak ho zkopírovat nebo stáhnout, nechci návod jak ho vložit do stránek. |
||
Keeehi Profil |
#11 · Zasláno: 15. 8. 2016, 10:56:05
leorond:
„místo toho aby mi někdo vysvětlil základ ( což by někomu kdo to umí zabralo 5 minut psaní )“ A proč by kdokoli měl trávit svých 5 minut (spíše půl hodiny), když základy už byly vysvětleny mockrát a na spoustě místech. Ano, spoustu toho je v angličtině ale bez angličtiny na úrovni alespoň čtení dokumentace to dneska už bohužel moc nejde. Přesto se dají najít i články v češtině. AJAX citron.blueboard.cz/clanek/ajax-navod-pro-zacatecniky citron.blueboard.cz/clanek/univerzalni-funkce-pro-ajax citron.blueboard.cz/clanek/jquery-pro-zacatecniky-ajax jquery-navod.cz/kategorie-ajax/9-ajax (suvisející) Změna URL bez obnovení stránky, Stránkování „zprovoznit demo stránkování které někdo vytvořil nebo od někoho zkopíroval,“ Ale to je právě přesně to, co by jsi měl udělat. Zprovozníš demo a koukáš, jak funguje. Šťoucháš do něj z různých stran a pozoruješ, co to s ním dělá. Z toho dostaneš mnohem lepší představu o technologii než z jejího popisu nebo ukázky samotného kódu. Ano hodí se i přečíst si nějaký článek nebo manuál, ale to už budeš vědět o čem tam zrovna mluví a bude to dávat větší smysl. |
||
Fisir Profil |
Reaguji na leoronda:
Opakování je sice matka moudrosti, ale zjevně nikdo nevidí důvod, proč popisovat již mnohokrát popsané znovu extra pro tebe. V tvém případě by bylo dobré zopakovat něco jiného — jestli chceš programovat, musíš umět anglicky (alespoň pasivně). Dneska ale mám dobrou náladu, tak jsem ti ten odkaz od martina1312 v [#5] přeložil. # AJAXové stránkování s jQuery a PHPStránkování je klíčovou součástí každého webu, zejména pokud má stovky záznamů v databázi, které je třeba najednou vypsat. V dnešní době je za použití AJAXu možné vytvořit stránkování, které nevyžaduje žádné obnovení stránky a uživatelé mohou zůstat na stejné stránce a rychle procházet velké počty záznamů. V tomto článku využijeme jQuery a PHP pro vytvoření AJAXového stránkování pro procházení vašich záznamů v databázi bez nutnosti obnovit stránku. ![]() Ajax Pagination = AJAXové stránkování; Results = výsledky HTMLNejprve vytvoříme HTML soubor, který bude pomocí AJAXu volat PHP skript a načte odpověď dodiv u na stránce. Během načítání bude pro informaci zobrazen načítací obrázek.
<div class="nacitaci-div"><img src="nacitani.gif" ></div> <div id="vysledky"><!-- obsah se nahraje sem --></div> jQueryJe sice možné vytvářet AJAXové požadavky pouze za použití čistého JavaScriptu, ale vzhledem k tomu, že většina webů obsahuje jQuery, využijeme její vestavěnou metoduload() pro AJAXová volání na PHP skript. (*)
$(document).ready(function() { $("#vysledky" ).load( "nacist.php"); // načte první záznamy // kód níže se vykoná při kliknutí na odkazy ve stránkování $("#vysledky").on( "click", ".strankovani a", function (e){ e.preventDefault(); $(".nacitaci-div").show(); // zobrazit indikátor načítání var cisloStranky = $(this).attr("data-stranka"); // získá číslo požadované stránky $("#vysledky").load("nacist.php",{"stranka":cisloStranky}, function(){ // načíst obsah z PHP skriptu $(".nacitaci-div").hide(); // po načtení obsahu skrýt indikátor načítání }); }); }); Nejprve načteme první stránku záznamů zavoláním metody load() a následně připravíme událost při kliknutí na odkazy ve stránkování, které vyšlou AJAXový požadavek na PHP skript spolu s číslem požadované stránky. Výsledek pak bude vložen do elementu div#vysledky .
Načítání položek z databáze a vytvoření odkazů ve stránkování pomocí PHPNyní máme připravený jQuery kód pro vytváření AJAXových požadavků a je třeba vytvořit nový PHP skript, které na ně bude odpovídat. Tento PHP skript bude fungovat v pozadí a návštěvník nebude odkazován přímo na něj.$db_uzivatel = 'uzivatel'; // uživatel databáze $db_heslo = 'heslo'; // heslo uživatele $db_databaze = 'databaze'; // jméno databáze $db_hostitel = 'localhost'; // hostname nebo IP databázového serveru $zaznamu_na_stranku = 5; // počet zobrazených položek na stránce $mysqli = new mysqli($db_hostitel, $db_uzivatel, $db_heslo, $db_databaze); // ukončit skript v případě chyby připojení if ($mysqli->connect_error) { exit; // (**) } // získat číslo stránky z AJAXu if(isset($_POST["stranka"])){ $cislo_stranky = filter_var($_POST["stranka"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH); // zkontrolovat číslo if(!is_numeric($cislo_stranky)){die('Neplatné číslo stránky!');} // ukončit skript v případě neplatného čísla }else{ $cislo_stranky = 1; // jestliže číslo stránky není nastavené, použít 1 } // zjistit celkový počet záznamů v databázi $vysledky = $mysqli->query("SELECT COUNT(*) FROM zpravy"); $celkem_zaznamu = $vysledky->fetch_row(); // uložit celkový počet do proměnné // přepočítat počet záznamů na počet stran $celkem_stran = ceil($celkem_zaznamu[0]/$zaznamu_na_stranku); // stránkovací pozice $pozice = (($cislo_stranky-1) * $zaznamu_na_stranku); // vybrat záznamy pro požadovanou stránku $vysledky = $mysqli->prepare("SELECT id, jmeno, zprava FROM zpravy ORDER BY id ASC LIMIT $pozice, $zaznamu_na_stranku"); $vysledky->execute(); // vykonat připravený dotaz $vysledky->bind_result($id, $jmeno, $zprava); // napojit proměnné na výsledek dotazu // vypsat získané záznamy echo '<ul class="zpravy">'; while($vysledky->fetch()){ // načíst záznam echo '<li>'; echo $id. '. <strong>' .$jmeno.'</strong> — '.$zprava; echo '</li>'; } echo '</ul>'; echo '<div style="text-align: center;">'; // zavoláním stránkovací funkce vygenerujeme odkazy echo vytvorit_strankovani($zaznamu_na_stranku, $cislo_stranky, $celkem_zaznamu[0], $celkem_stran); echo '</div>'; Po připojení k MySQL databázi musíme získat celkový počet záznamů v tabulce a převést jej na počet stránek. Následně můžeme z databáze vypsat požadované záznamy využitím MySQL klauzule LIMIT . Jak je vidět na konci skriptu výše, voláme funkci vytvorit_strankovani() a předáváme nezbytné parametry pro vygenerování odkazů stránkování.PHP stránkovací funkceNíže je kód PHP funkce generující stránkovací odkazy podle předaných parametrů při jejím zavolání v našem PHP skriptu.function vytvorit_strankovani($zaznamu_na_stranku, $aktualni_stranka, $celkem_zaznamu, $celkem_stranek) { $strankovani = ''; if($celkem_stranek > 0 && $celkem_stranek != 1 && $aktualni_stranka <= $celkem_stranek){ // zkontrolovat počty stránek $strankovani .= '<ul class="strankovani">'; $odkazy_vpravo = $aktualni_stranka + 3; $predchozi = $aktualni_stranka - 3; // odkaz pro předchozí $dalsi = $aktualni_stranka + 1; // odkaz pro následující $prvni_stranka = true; // indikátor, zda je aktuální stránka první if($aktualni_stranka > 1){ $predchozi_odkaz = ($predchozi==0)?1:$predchozi; $strankovani .= '<li class="prvni"><a href="#" data-stranka="1" title="První">«</a></li>'; // první stránka $strankovani .= '<li><a href="#" data-stranka="'.$predchozi_odkaz.'" title="Předchozí"><</a></li>'; // předchozí stránka for($i = ($aktualni_stranka-2); $i < $aktualni_stranka; $i++){ // vytvořit odkazy v levé polovině if($i > 0){ $strankovani .= '<li><a href="#" data-stranka="'.$i.'" title="Strana #'.$i.'">'.$i.'</a></li>'; } } $prvni_stranka = false; // aktualní stránka není první } if($prvni_stranka){ // jestliže aktuální stránka je první $strankovani .= '<li class="prvni aktivni">'.$aktualni_stranka.'</li>'; }elseif($aktualni_stranka == $celkem_stranek){ // jestliže aktuální stránka je poslední $strankovani .= '<li class="posledni aktivni">'.$aktualni_stranka.'</li>'; }else{ // ani první, ani poslední $strankovani .= '<li class="aktivni">'.$aktualni_stranka.'</li>'; } for($i = $aktualni_stranka+1; $i < $odkazy_vpravo ; $i++){ // vytvořit odkazy v pravé polovině if($i<=$celkem_stranek){ $strankovani .= '<li><a href="#" data-stranka="'.$i.'" title="Strana #'.$i.'">'.$i.'</a></li>'; } } if($aktualni_stranka < $celkem_stranek){ $dalsi_odkaz = ($i > $celkem_stranek)? $celkem_stranek : $i; $strankovani .= '<li><a href="#" data-stranka="'.$dalsi_odkaz.'" title="Následující">></a></li>'; // následující stránka $strankovani .= '<li class="posledni"><a href="#" data-stranka="'.$celkem_stranek.'" title="Poslední">»</a></li>'; // poslední stránka } $strankovani .= '</ul>'; } return $strankovani; // vrátit kód stránkování } ZávěrAutor též vytvořil CSS, které stránkování nastyluje pro lepší vzhled (***), stáhnout si jej můžete v ukázce, případně se podívejte na demo. Snad vám to pomůže vytvořit stránkování pro vaše stránky. Jestliže chcete záznamy načítat jako na Facebooku nebo Twitteru, přečtěte si článek Loading More Results (anglicky).přeloženo z anglického originálu Ajax Pagination with jQuery & PHP přeložil jsem první článek, na který bylo v tomto vlákně odkázáno, tím neříkám, že je výjimečné kvality nebo že bych postupoval stejně překládal jsem to rychle bez další kontroly, za kvalitu neručím (*) s tímto tvrzením překladatel zásadně nesouhlasí (**) původní skript obsahuje vypsání chybové hlášky, upraveno z důvodu bezpečnosti (***) CSS styl není součástí překladu a bez přeložení tříd a identifikátorů v něm uvedených nebude s přeloženými kódy fungovat |
||
leorond Profil |
Fisir: Děkuji ti mockrát :) nemusel jsi celý článek překládat, stačilo by vlastními slovy popsat ten JS abych to pochopil :)
Jinak pokud se jedná o angličtinu tak se jí snažím doučit ale nejsem už nejmladší a moc mi to do hlavy už neleze tak je pro mne jednoduší si nechat ten script česky stručně popsat a zbytek už se učím z různých zdrojů včetně pokus omyl. Má tu ovšem jeden problém a to že mi nefunguje stránkování, když kliknu na odkaz tak dostanu do lišty # ale stránka nepřeskočí. Nevíš kde by mohla být chyba? |
||
leorond Profil |
Tak už jsem chybu našel vše funguje správně ještě jednou děkuji Fisir :)
Předělal jsem to na procedurální styl a snad je to správně <?php include('../setings/connect.php'); include('../setings/strankovani_ajax.php'); $zaznamu_na_stranku = 3; // počet zobrazených položek na stránce // získat číslo stránky z AJAXu if(isset($_POST["stranka"])){ $cislo_stranky = filter_var($_POST["stranka"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH); // zkontrolovat číslo if(!is_numeric($cislo_stranky)){die('Neplatné číslo stránky!');} // ukončit skript v případě neplatného čísla }else{ $cislo_stranky = 1; // jestliže číslo stránky není nastavené, použít 1 } // zjistit celkový počet záznamů v databázi $vysledky = mysqli_query($con, "SELECT COUNT(*) FROM news_koment"); $celkem_zaznamu = mysqli_fetch_row($vysledky); // uložit celkový počet do proměnné // přepočítat počet záznamů na počet stran $celkem_stran = ceil($celkem_zaznamu[0]/$zaznamu_na_stranku); // stránkovací pozice $pozice = (($cislo_stranky-1) * $zaznamu_na_stranku); // vybrat záznamy pro požadovanou stránku $vysledky = mysqli_prepare($con, "SELECT id_news_koment, komentar, user_kom FROM news_koment ORDER BY id_news_koment ASC LIMIT $pozice, $zaznamu_na_stranku"); mysqli_stmt_execute($vysledky); // vykonat připravený dotaz mysqli_stmt_bind_result($vysledky, $id_news_koment, $komentar, $user_kom); // napojit proměnné na výsledek dotazu // vypsat získané záznamy echo '<ul class="zpravy">'; while(mysqli_stmt_fetch($vysledky)){ // načíst záznam echo '<li>'; echo $id_news_koment. '. <strong>' .$komentar.'</strong> — '.$user_kom; echo '</li>'; } echo '</ul>'; echo '<div style="text-align: center;">'; // zavoláním stránkovací funkce vygenerujeme odkazy echo vytvorit_strankovani($zaznamu_na_stranku, $cislo_stranky, $celkem_zaznamu[0], $celkem_stran); echo '</div>'; ?> K mému překvapení asi i správně a alespoň tomu rozumím, teď si jdu hrát s tím JS :) |
||
Časová prodleva: 9 let
|
0