AJAX + PHP + id

AJAX + PHP + id
2017-09-14T21:52:06+02:00
2017-09-15T13:30:49+02:00
2022-12-04T19:00:39+01:00
ajaxphp
Üdvözlöm a Fórum Tagokat!

Szeretném a segítségeteket kérni:

Nem tudom megoldani, hogy egy oldalon újra betöltődés nélkül elérjek egy id pontot.
Példa: <div id="ide"></div>
Jelenleg: javascriptben meghívok egy php fájlt (itt.php) és az kiírja az adatokat újra betöltődés nélkül, ha a POST megkapja az data kulcs hivatkozást***: az információ megjelenik az index.php oldalon. Szeretném, ha a <div id="ide">-hez tartozó pont kerülne megjelenítésre, mert az összes információ nem fér ki egy oldalra. Kérlek segítsetek, ha meglehet oldani: a scrollTo-val próbálkoztam, de nem tudtam megoldani.

Köszönettel: mika

event.preventDefault();

var oid = $(this).attr('oid');

// teszt id = alert(oid);

$.ajax({

url : "itt.php",

method : "POST",

data : {***errehivatkozokaphpoldalon:1,offer_id:oid},

success : function(data){

$("#get_offer_solo").html(data);

if($("body").width() < 480){

$("body").scrollTop(683);

}

}

})

})
Mutasd a teljes hozzászólást!
Az internet bölcs népe szerint így tudod animálva görgetni az adott elemhez:

$('html, body').animate({ scrollTop: $("#ide").offset().top }, 2000);
(a 2000 az animáció hossza ezredmásodpercben)

Ha nem kell animálni, csak odaugrani, akkor pedig:

$('html, body').scrollTop($("#ide").offset().top);
Gondolom ez arra az esetre jó csak, ha nincs az oldalon belül görgethető elem, és csak magát az oldalt kell a kívánt pontra görgetni. Ha az #ide elem görgethető elemen belül van, vagy esetleg több görgethető elembe van beágyazva, akkor a szülő elem(ek)et is a megfelelő helyre kell görgetni, aztán magát az oldalt a legkülső görgethető elemhez.
Mutasd a teljes hozzászólást!

  • 1. Érthetőbb, világosabb megfogalmazást írj le!
    2. Használd a Forráskód gombot ha kódot illesztesz be!
    3. Mit is jelent? => "elérjek egy id pontot" => Egy adott elem-hez gördüljön?
    4. Miért is ez a cél? => Ha a body szélesség < 480px akkor függőleges görgetés 683px-re...
    Szóval fogalmazz világosabban és releváns HTML,JS,PHP kódrészt mellékelj "Forráskód blokkba".
    Akkor talán segítő választ is kaphatsz...
    Megj: Lehet, hogy hasonlít a Te kérdésed-re?
    Mutasd a teljes hozzászólást!
  • Szeretném pontosabban leírni a helyzetet:

    Van 3 fájl:
    1. index.php
    2. run.js
    3. itt.php

    Az index.php-ban van 10 div <div id="egyedi id">-vel benne a különböző tartalom.
    Ez egy oldalra nem fér el, ezért szeretném elérni az "ide" div tagot.

    <div id="1"></div> <div id="2"></div> <div id="3"></div> <div id="4"></div> <div id="ide"></div> <div id="6"></div>
    A run.js most behívja a itt.php fájt és kiírja az adatokat (amit a mysql-ból kapok), de nem gördül a kért id elem-hez. (nem tudom hogyan lehet megoldani)

    event.preventDefault(); var oid = $(this).attr('oid'); // teszt id = alert(oid); $.ajax({ url : "itt.php", method : "POST", data : {***errehivatkozokaphpoldalon:1,offer_id:oid}, success : function(data){ $("#get_offer_solo").html(data); if($("body").width() < 480){ $("body").scrollTop(683); } } }) })
    Jelenleg a run.js működik, de egy plusz kérést szeretnék hozzá rendelni: hogy egy adott elem-hez gördüljön a kérést követően. A jelenlegi esetben az ide id-hez.

    Előre is köszönöm a segítséget!
    Mutasd a teljes hozzászólást!
  • az itt.php
    ...

    if(isset($_POST["errehivatkozokaphpoldalon"])){ //pdo 1 start $oid=$_POST["offer_id"]; $book = $con->prepare("SELECT * FROM my_new_book WHERE book_id = :id"); $book->bindValue(':id',$oid); $book->execute();
    ...
    Mutasd a teljes hozzászólást!
  • Az internet bölcs népe szerint így tudod animálva görgetni az adott elemhez:

    $('html, body').animate({ scrollTop: $("#ide").offset().top }, 2000);
    (a 2000 az animáció hossza ezredmásodpercben)

    Ha nem kell animálni, csak odaugrani, akkor pedig:

    $('html, body').scrollTop($("#ide").offset().top);
    Gondolom ez arra az esetre jó csak, ha nincs az oldalon belül görgethető elem, és csak magát az oldalt kell a kívánt pontra görgetni. Ha az #ide elem görgethető elemen belül van, vagy esetleg több görgethető elembe van beágyazva, akkor a szülő elem(ek)et is a megfelelő helyre kell görgetni, aztán magát az oldalt a legkülső görgethető elemhez.
    Mutasd a teljes hozzászólást!
  • Persze csak akkor a kérdező igénye alapján => ha a body szélessége kisebb, mint 480px...
    Megj: És ide már nem jutott el...
    Mutasd a teljes hozzászólást!
  • Nagyon köszönöm segítségeteket!

    Külön köszönöm Csaboka2, hogy konkrét segítséget nyújtottál: nem tudtam, hogy
    ebben az esetben is használható-e a scrollTo Jquery függvény.

    A következő változtatást szeretném bemutatni:

    itt.php: a

    <div id="ide">
    elemet kívülre helyeztem és ebben van a

    id="get_offer_solo"

    Az oldal most is görgethető, de a megadott id elem-het gördül az adatok lekérdezése után is.

    .php

    ... <div id="1"></div> <div id="2"></div> <div id="3"></div> <div id="4"></div> <div id="ide"> <div id="get_offer_solo"> </div> </div> <div id="6"></div> ...

    A JavaScript:

    $("body").delegate(".ips","click",function(event){
    $("#get_offer_solo").html("<h3>Loading...</h3>");
    event.preventDefault();
    var pid = $(this).attr('pid');
    //////////////////////////////////////////////// test id = alert(cid);
    $.ajax({
    url : "action.php",
    method : "POST",
    data : {get_ips:1,ips_id:pid},
    success : function(data){
    $("#get_offer_solo").html(data);
    // $.scrollTo($("#ide"), { duration: 0});
    $('html, body').animate({
    scrollTop: $("#ide").offset().top
    }, 6000);
    if($("body").width() < 480){
    $("body").scrollTop(683);
    }
    }
    })
    })

    prog.hu köszönöm szépen!
    Mutasd a teljes hozzászólást!
  • Biztos, hogy 480 pixelnél keskenyebb böngészőablak esetén a 683. pixelre akarsz görgetni az animáció megkezdése előtt? Csak mert innen nem látszik az értelme.

    (Értsd is meg, hogy mit csinálsz, ne csak másold be...)
    Mutasd a teljes hozzászólást!
  • Három a magyar igazság.

    "2017.09.15. 05:51"-kor & "2017.09.15. 10:13"-kor & "2017.09.15. 12:44"-kor

    Talán most már érthető lesz mindenkinek...
    Mutasd a teljes hozzászólást!
  • Én láttam az előző két említést is, de a kedves kérdezőnek úgy látszik sikerült elsiklani felettük.
    Mutasd a teljes hozzászólást!
Tetszett amit olvastál? Szeretnél a jövőben is értesülni a hasonló érdekességekről?
abcd