خرید بک لینک

درباره سایت

CodingForums

آخرین مطالب

امکانات وب

increase limit of query by given amount using php and ajax

I'm trying to show a limited set of topics on a page (i.e. LIMIT 10 in query) then have a button that will load the next 10 (now LIMIT 20 in same query).

The problem is that when I press the button, it not only refreshes the the specified div - but it re-runs the getForumTopic at the very top of the page - and thereby resetting the LIMIT to 10... so nothing happens on the page...

But if I
1. load the result-page
2. comment out the getForumTopic at top of page
and first then...
3. click the button

It works as perscribed... it now show 20 topics... and if I click again it shows 30... etc.

And if I uncomment the getForumTopic at the very top of page again and click the button... it now shows 10 topics again...

the code in question in my ajax-code - which is the code that is supposed to only refresh the div in question (ie. #showtopics) but insists on re-ruing the getForumTopic from the top of the page also
Code:
self.closest("#showtopicsAll").find("#showtopics").load(location.href + " #showtopics>*", "");
under success

I can't see why my code would re-run the getForumTopic at the top of page... but hopeully some of you wise folks can see the error of my ways and set me on the right path...

My basic setup:
getForumTopic.php (using the categoryID ($_GET), and liimit (10) from getForumTopic at top of topics page)
Code:
SELECT
    ft.date AS ftDate ,
    ft.title AS ftTitle ,
    ft.summary AS ftSummary ,
    ft.randomString AS ftRandomString ,
    u.username AS uUsername

FROM
    forumtopic AS ft

LEFT JOIN
    userlogininfo AS u
ON u.id = ft.userID

WHERE
    categoryID = ?

ORDER BY
    ft.date DESC

LIMIT ?
it then takes those results - puts them in arrays - and set them in session cookies that is then used to display the info found on the webpage

page with results:
Code:
<?php
    getForumTopic ($pdo, $_GET['forumcategory'], 10); // starts out limit 10
?>
.
.
.
<div id="showtopicsAll">
    .
    .
    .
    <div id="showtopics">
        // Loop through the found topics using the values from the session cookies set in getForumTopic to populate the page
     
      <div class="show-more-topic">
         
          <input type="hidden" id="categoryID" name="categoryID" value="<?php echo $_GET['forumcategory']; ?>">
          <input type="hidden" id="topicCount" name="topicCount" value="<?php number of found topics in getForumTopic ?>">
         
          <button id="showMoreTopic">
          </button>
         
      </div>
     
    </div>
   
</div>
My jQuery
jQuery.js
Code:
$(document).ready(function(){
    "use strict";
    $(document).on('click','button[id^="showMoreTopic"]', function(){
        var self = $(this);
        var closestDiv = self.closest('.show-more-topic');
        var topicCount = closestDiv.find("#topicCount").val();
        var categoryID = closestDiv.find("#categoryID").val();
        var topicCountNew = + topicCount + 10;
        $.ajax({
            type: "POST",
            url:'../scripts/moretopic.php',
            data:"topicCountNew="+topicCountNew+"&categoryID="+categoryID,
            success:function(){
                self.closest("#showtopicsAll").find("#showtopics").load(location.href + " #showtopics>*", "");
            }
        });
    });
});
And lastly my php called from the ajax
moretopic.php
Code:
session_start ();

require ( "../scripts/definitions.php" ); // holds some definitions needed for functions.php to work
require ( "../scripts/functions.php" ); // holds the getForumTopic function + the coection script for $pdo

$categoryID = $_POST['categoryID'];
$limit = $_POST['topicCountNew'];

getForumTopic ( $pdo , $categoryID , $limit ); // repopulates the session cookie now with 20 topics, 30 topics, 40... until no more so they are ready when the div is refreshed
And like I said... all code works perfectly if I comment out the getForumTopic at the top of page after first page load... but not a valid user friendly solution :)

Update
So I did some tinkering and found a sort of hack

by adding above getForumTopic
Code:
if (isset($_SESSION['countTopic_getForumTopic'])) {
    $limit = $_SESSION['countTopic_getForumTopic'];
} else {
    $limit = 10;
}
and then changing the getForumTopic call to
Code:
getForumTopic ($pdo, $_GET['forumcategory'], $limit);
The button now does what I want with one caviot... because the $_SESSION['countTopic_getForumTopic'] is now 20, 30, 40,... and is stored in a session cookie it stays that way...

So if user now goes to another page and later come back - the session cookie is still set to 20, 30, 40,... and the page will still show that amount of topics (at least until user logs out)... which is not ideal...

+ it's a hack - and it's not even a very elegant one at that

There has to be an easier way to accomplice what I want...

+ I still don't get why my
Code:
self.closest("#showtopicsAll").find("#showtopics").load(location.href + " #showtopics>*", "");
re-runs any functions on top of the page.... as far as I can seee it shouldn't...

برچسب: نویسنده: آیلین رضوانی تاريخ: جمعه 24 آذر 1396 ساعت: 7:56

صفحه بندی

آرشیو مطالب

پيوندهای روزانه

لینک دوستان

خبرنامه