DataTables adatmegjelenítés furaság - kezdő kérdés
2022-08-05T12:04:32+02:00
2022-08-07T16:43:07+02:00
2022-08-07T17:00:27+02:00
horst64
Sziasztok!
Több évtizede programozok már (talán túl sok is), de a webprogramozás sose volt a szakterületem / kedvencem. Bár abszolút kezdőt tudtam segíteni a tapasztalatommal és pár évente biztosan elolvasok néhány webprogramozásról szóló könyvet, azért, hogy legyen fogalmam a fejlődésről, de rutinom nincs sok. Képességem arra terjed ki, hogy ki tudok egészíteni weblapot új funkciókkal, ott, ahol nem számít sokat a dizájn, mert szűk felhasználó bázis használja. Kb. 5-10 weblaphoz volt közöm az életben, meg jópár joomláshoz. Képes vagyok megtalálni hibát is - kivéve ebben az esetben.

Most egyéb szakterületemhez kapcsolódva kellene csinálnom egy olyan szimpla weblapot, amibe androidról töltök fel adatot és azt pár emberke néha lekérdezi. Ilyet már csináltam, de most kicsit lépni szeretnék és elővettem egy programozási könyvben szereplő alap weblap mintát és azt kiegészítettem egy datatables-sal. Sosem használtam még ilyet, s csak a végén derült ki, hogy bajom van vele.
A baj a következő: a weblap megjelenik, van rajta hét menüpont. Nagyon alapvető funkciókkal - de már a mintában is javítanom kellett, hogy működjön. Egyetlen menüpont alatt van ez a datatables, s ha erre a menüpontra rákattintok,

'header.php <a data-role='button' data-inline='true' data-icon='grid' data-transition="slide" href='payments.php?r=$randstr'>Payments</a>
akkor a payments.php megnyílik, megjelenik a táblázat fejléce, de - bár kellene - adat nincs benne.

require_once 'header.php'; ... echo <<<_END <div > <!-- Table --> <table id='empTable' class='display dataTable'> <thead> <tr> <th>Sofőr</th> <th>Túraszám</th> <th>Boltkód</th> <th>Összeg</th> <th>Deviza</th> <th>Dátum</th> <th>Sikeres I/N</th> <th>AFR I/N</th> </tr> </thead> <tbody> </tbody> </table> </div> <!-- Script --> <script> function dotable() { //tbl.destroy(); tbl = $('#empTable').DataTable({ 'processing': true, 'serverSide': true, 'serverMethod': 'post', bDestroy: true, dom: 'Bfrtip', 'ajax': { 'url':'ajaxfile.php' }, buttons: [ 'excel' ], 'columns': [ { data: 'soforkod' }, { data: 'turaszam' }, { data: 'boltkod' }, { data: 'osszeg', className: "dt-right" }, { data: 'deviza' }, { data: 'datum' }, { data: 'resultin' }, { data: 'afrin' } ] }); }; $(document).ready(function(){ //alert("ready"); dotable(); }); function tblRefresh() { document.location.reload(true); } </script> _END; echo "<br><a data-role='button' onclick='tblRefresh()'>Refresh payments</a>";
Az ajaxfile.php-ba tettem fájlba mentést, látom, hogy az lefut, ad vissza adatot, de a datatables nem jeleníti meg. Hibaüzenet nincs.
Most jön a csavar: ha a kód alján látható frissítés gombra kattintok, a táblázat feltöltődik a várt adatokkal. Ha a böngésző frissítés gombjára kattintok, akkor is feltöltődik. Ha a most képernyőn látható payments gombra bökök, akkor a táblázat kiürül.

Hát itt akadtam el. Ha valaki lenne olyan segítőkész és ránéz, azt nagyon megköszönöm! (A weblap localhoston van, de ha kell, felteszem valahová)
Horst
Mutasd a teljes hozzászólást!
Na ehhez kellett volna nekem A rutin.
A datatables remekül működik a jquery-3.3.1.min.js-sel. Az előzőekkel nem.
A mintaprojektben benne lévő jquery.mobile-1.4.5.min pedig már régen nincs fejlesztve és nem is kompatibilis a jquery.3.x.x-el. Tehát evvel kár is bajlódni.
Ennyi.
Mutasd a teljes hozzászólást!

  • A source kódot tedd fel. A Githubra, a  demo oldalt pedig egy tárhelyre.
    Mutasd a teljes hozzászólást!
  • javascripthez nem értek, de ha a gombra lefut a refresh(), akkor ugyanezt kellene lefuttatnod az onLoad() vagy valami hasonló nevű eseményben, amikor az oldal betöltődik.
    Gondolom, a refresh() nem fut le magától a betöltéskor, ezt kellene kikényszeritened vhogy.
    Mutasd a teljes hozzászólást!
  • Máris segítettetek! Árnyalódik a kép. Feltettem a mintaoldalt  teszt.leichter.hu-ra (csak azért, hogy teszteljem a datatables-t).
    A forrás meg itt van: www.leichter.hu/demo/robinsnest.zip

    A login friend pw friend.
    Az egyetlen fontos menüpont a payments.

    A jelenség a következő: ha a payments-re kattintok, akkor megjelenik a táblázat, ez így jó. Ha előbb másik menüpontra kattintok (a log outon kívül), majd a payments-re, akkor a táblázat üres marad. Katt a refresh pamyents-re, vagy a böngésző frissítés gombjára vagy még egyszer a payments gombra: azonnal megjelenik a táblázat.
    Mutasd a teljes hozzászólást!
  • Igen, ez van a
    $(document).ready()
    -ban, csak valami fura oknál fogva hiába fut le (ahogy írtam fájlba mentem a visszakapott adatokat), a táblázatot nem mindig tölti fel.
    Mutasd a teljes hozzászólást!
  • Bzozoo-val értek egyet, a kód hiányában ezt nehéz debugolni.

    Bár nem írtad, de a "data-transition" attribútumból arra tippelek, hogy használsz valami csoda single page application framework-öt, ami a linkek követésekor nem normális oldalbetöltést csinál, hanem AJAX-szal hív rá a megadott URL-re és a DOM fába tölti a kapott markupot. Ha tényleg így van, akkor oldalbetöltés hiányában a szkriptjeid lehet nem futnak le, vagy nem pont úgy, mint egy "friss" oldalon futnának. Az újratöltés azért gyógyítja meg, mert akkor tényleg direktben hívódik meg a PHP által kiadott kód, nem mindenféle varázslaton keresztül.

    Egyébként ha nem ismernéd, minden böngészőben van fejlesztői eszközkészlet, ami F12 billentyűvel hozható elő. Ott is lerakhatsz a JS szkriptek bármelyik sorára breakpointot, és végigléptetheted a kódot. Bár lehet ebbe is bekavar, ha dinamikusan töltődik be az oldal...
    Mutasd a teljes hozzászólást!
  • Nálam a Payments-nél megjelenik a táblázat, mindegy mire kattintottam előtte. Viszont ha a Refresh Payments-re kattintok, redirect loop-ba kerülök. A Network tabon nem látok 3xx-es választ, úgyhogy gondolom szkript csinálja.
    Mutasd a teljes hozzászólást!
  • A forráskódot is feltettem, a 9:57-es hsz-ben van. Az elmaradó oldalbetöltést úgy oldja meg a szerző, hogy minden egyes menüpont híváskor kap egy véletlen paramértert, így minden oldalbehívás új. Ez így is van, mert ha kiveszem ezt a paramétert (
    ?r=$randstr
    )
    , akkor tényleg nincs frissítés.
    A nyomkövetést kipróbáltam, de valóban nincs benne gyakorlatom és mivel a payments.php-ben nem sok javascript van, sikerült a jquery forrására tévedni, az meg nem annyira olvasható számomra.

    Viszont kiveszem a data-transition-okat, hátha tényleg segít!
    Mutasd a teljes hozzászólást!
  • "
    Nálam a Payments-nél megjelenik a táblázat, mindegy mire kattintottam előtte. Viszont ha a Refresh Payments-re kattintok, redirect loop-ba kerülök. A Network tabon nem látok 3xx-es választ, úgyhogy gondolom szkript csinálja.
    "

    A legártatlanabb rész (szerintem), a gomb ennyit csinál:

    document.location.reload(true);
    Mutasd a teljes hozzászólást!
  • Történt némi változás. Leszedtem az idézett "data-transition" és társait a headerből, így sima és csúnya a... href maradt a menünek, de ettől nem változott semmi. A táblázat hol megjelenítette az adatokat, hol nem.
    Utána - mindenféle tudományos okot nélkülözve - kicseréltem az eredeti "jquery-2.2.4.min.js" hivatkozást erre: "jquery-3.3.1.min.js" (localhoston).
    Láss csodát, az alap problémám megszűnt, a táblám mindig megjeleníti a kapott adatot csak az oldal esett szét. Most keresgélnem kell, hogy mi lett a css-sel - amihez szándékosan nem nyúltam.
    Mutasd a teljes hozzászólást!
  • Na ehhez kellett volna nekem A rutin.
    A datatables remekül működik a jquery-3.3.1.min.js-sel. Az előzőekkel nem.
    A mintaprojektben benne lévő jquery.mobile-1.4.5.min pedig már régen nincs fejlesztve és nem is kompatibilis a jquery.3.x.x-el. Tehát evvel kár is bajlódni.
    Ennyi.
    Mutasd a teljes hozzászólást!
abcd