Home Answers Viewqa PHP load more with jquery

 
 


sridhar Bodakunti
load more with jquery
0 Answer(s)      a year and 4 months ago
Posted in : PHP

i am using jquery to loadmore "posts" from my site as pagination like twitter... it's working for all posts in my table but it's not working for filtering table.. means if i am entering "php" in my search box its is going to display php posts and after that when i click on load more button it is displaying the entire posts but it can display only php posts... whats the problem can any one will say please? here is my code::::::

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ajax Auto Suggest</title>
    <link rel="icon" href="../favicon.ico" type="image/x-icon" />
    <script type="text/javascript" src="jquery-1.4.4.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#loadmorebutton").click(function (){
                $('#loadmorebutton').html('<img src="ajax-loader.gif" />');
                $.ajax({
                    url: "loadmore.php?lastid=" + $(".postitem:last").attr("id"),
                    success: function(html){
                        if(html){
                            $("#postswrapper").append(html);
                            $('#loadmorebutton').html('Load More');
                        }else{
                            $('#loadmorebutton').replaceWith('<center>No more posts to show.</center>');
                        }
                    }
                });
            });
        });
    </script>

<script type="text/javascript" src="jquery-1.2.1.pack.js"></script>
<script type="text/javascript">
    function lookup(inputString) {
        if(inputString.length == 0) {
            // Hide the suggestion box.
            $('#suggestions').hide();
        } else {
            $.post("rpc.php", {queryString: ""+inputString+""}, function(data){
                if(data.length >0) {
                    $('#suggestions').show();
                    $('#autoSuggestionsList').html(data);
                }
            });
        }
    } // lookup

    function fill(thisValue) {
        $('#inputString').val(thisValue);
        setTimeout("$('#suggestions').hide();", 200);
    }


function fun1()
{
    document.form1.style.visibility="hidden"
}

</script>

<style type="text/css">
    body {
        font-family: Helvetica;
        font-size: 11px;
        color: #000;
    }

    h3 {
        margin: 0px;
        padding: 0px;   
    }

    .suggestionsBox {
        position: relative;
        left: 30px;
        margin: 10px 0px 0px 0px;
        width: 200px;
        background-color: grey;
        -moz-border-radius: 7px;
        -webkit-border-radius: 7px;
        border: 2px solid #000; 
        color: #fff;
    }

    .suggestionList {
        margin: 0px;
        padding: 0px;
    }

    .suggestionList li {

        margin: 0px 0px 3px 0px;
        padding: 3px;
        cursor: pointer;
    }

    .suggestionList li:hover {
        background-color:green;
    }
    </style>

    <style>
        body{ margin:0px; }
        #hycusdemosheader{ font-family:Georgia; font-size:30px;border-bottom:1px solid #676767;padding:5px 5px 8px;margin-bottom:10px; }
        #idh, #idh:visited { color:#000; text-decoration:none; }
        #hycusdemosheader span{ color:#999; }
        #downloadbutton{ color:#ffffff;background:#03AEEB;float:right;font-size:20px;padding:5px;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;text-decoration:none; }
        #downloadbutton:hover{ background:#888888; }
        #hycucdemosbody{ padding:10px 0; min-height:500px; }
        #hycusdemosfooter{ border-top:1px solid #676767; padding:10px; font-size:20px; }
        #hycusdemosfooter a{ text-decoration:none; }
        #wrapper{
            width:600px;
            margin:auto;
        }
        .spacer{
            clear:both;
            height:5px;
        }
        .txtarea{
            font-size:18px;
            height:50px;
            width:100%;
        }
        #postswrapper{

        }
        .postitem{


            font-size:24px;
        }
        .postitem:hover{
            background:#EFEFEF;
        }
        #newpostlink{
            display:block;text-align:center;border:2px solid #414141;background:#7D7D7D;color:#fff; margin: 0 0 10px;padding:5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;font-size:20px;text-decoration:none;
        }
        #loadmorebutton{ width:100%;height:30px; }
    </style>

</head>

<body>


        <form method="get" action="">
            <div>
                <br />
                <input type="text" size="30" value="" id="inputString" name="inputstring" autocomplete="off" onkeyup="lookup(this.value);" onblur="fill();" />
                <input type="submit" name="sub" value="search" onsubmit="return fun1(this)" onclick="fun1()">
            </div>

            <div class="suggestionsBox" id="suggestions" style="display: none;">
                <img src="upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" />
                <div class="suggestionList" id="autoSuggestionsList">
                    Â 
                </div>
            </div>
        </form>


<div id="form1" >
<?php /*?><?php
include("dbconnect.php");
error_reporting(0);
$stt=mysql_query("select * from post order by post_date desc");
echo "<table border='1' bgcolor='lightblue' width='100%' height='auto'>
<tr>
<th>Title</th>
<th>Description</th>
<th>Date</th>
</tr>";
while($rec=mysql_fetch_array($stt))
{
    echo "<tr><td>"."<a href='readme.txt'>".$rec['post_title']." </a></td>";
    echo "<td><a href='readme.txt'><font size='5'>".$rec['post_title']."</font></a><br>".substr($rec['Description'],0,100)."........<a href='readme.txt'>more</a></td>";
    echo "<td>".$rec['post_date']."</td></tr>";
}
echo "</table>";
?></div>

    <div id="new" style="width:auto">  <?php */?>
    <div id="hycucdemosbody">
    <div id="wrapper">
        <div id="postswrapper">
    <?php
    session_start();
    include("dbconnect.php");
    if(isset($_GET['sub']))
{
$qs=$_GET['inputstring'];
$stt=mysql_query("select * from post where post_title like '%$qs%' order by post_date desc limit 0,3");
while($rec=mysql_fetch_object($stt))
{
    echo '<div class="postitem" id="'.$rec->post_date.'">';
    echo '<table border=1><tr><td><a href="readme.txt">'.$rec->post_id.' </a></td>';
    echo "<td><a href='readme.txt'><font size='5'>".$rec->post_title."</font></a><br>".substr($rec->Description,0,175)."........<a href='readme.txt'>more</a></td>";
    echo "<td>".$rec->post_date."</td></tr></table></div>";
}
echo "</table>";
}
?>
</div>
        <div id="loadmoreajaxloader" style="display:none;"><center><img src="ajax-loader.gif" /></center></div>
        <br/>
        <button id="loadmorebutton">Load More</button>

    </div>
</div>
</div>
</body>
</html>

loadmore.php

<?php
session_start();
error_reporting(0);
$dblink = mysql_connect('localhost', 'root', '');
mysql_select_db('avaara');

if($_GET['lastid'])
{
    $qs2=$_GET['qs2'];
    $as=$_GET['lastid'];
    echo $_GET['qs2'];
    $query = 'SELECT * FROM post WHERE post_date < "'.$as.'" ORDER BY post_date DESC LIMIT 0, 3';
    $result = mysql_query($query);
echo $qs1;
    while($rec = mysql_fetch_object($result))
    {
        echo '<div class="postitem" id="'.$rec->post_date.'">';
    echo '<table border=1><tr><td><a href="readme.txt">'.$rec->post_id.' </a></td>';
    echo "<td><a href='readme.txt'><font size='5'>".$rec->post_title."</font></a><br>".substr($rec->Description,0,175)."........<a href='readme.txt'>more</a></td>";
    echo "<td>".$rec->post_date."</td></tr></table></div>";
    }
}
?>
View Answers









Related Pages:
load more with jquery
load more with jquery  i am using jquery to loadmore "posts" from my... box its is going to display php posts and after that when i click on load more...); $('#loadmorebutton').html('Load More
jQuery Ajax load request
jQuery Ajax load request  Hi, How to use jQuery to send the request on server to load data in web page? Thanks   Hi, In the jQuery Load... and then load the data in web page. Thanks
jQuery - jQuery Tutorials and examples
Using the QUnit to test jQuery application More jQuery Tutorials: Here... Tutorial Collection of more than 100 tutorials on jQuery.   Server... browser.   jQuery Load Content In this section you will learn
jQuery Load Content
jQuery Load Content       In this section you will learn how to load content of a text file using jQuery... of simple text file and then show on the text box. Our jQuery Load Content example
How jQuery works?
. The jQuery is designed to do more work in less coding. It's very easy... more about jQuery with the help of many examples Learn from experts! Attend... How jQuery Works?     
jQuery Demos
and installing jQuery Server time Example jQuery Load... jQuery Demos and quick examples       jQuery Demos The best way to learn a new technology
optimze page load - Java Beginners
{ background-color: #000; } jQuery(function
Conflict with jQuery scripts
Conflict with jQuery scripts  Hi, How to avoid Conflict with jQuery scripts while using jQuery with other libraries? Thanks   Hi, Read the using jQuery with other libraries tutorial for more information. Thanks
How will you load a specific locale? - Java Beginners
How will you load a specific locale?  HI, Please tell me how to load a specific locale in Java program. Thanks   Hi Friend, You can use ResourceBundle.getBundle("Locale.UK"); For more information, visit
jQuery Features
jQuery Features       jQuery have lot of functionalities but some of the key features are given below : Selection of DOM elements : The jQuery selector provide us
jquery search for html pages
jquery search for html pages  i want to search html pages with jquery, it is k for single page but i want search more than one page at a time. Thank you in advance
jQuery tutorial for beginners
message on the page load. Step 1: Downloading jQuery library The jQuery library...jQuery tutorial for beginners Learn jQuery with the help of our tutorial jQuery tutorial for absolute beginners. This is complete jQuery tutorial
jQuery ajax json
jQuery ajax json  Hi, How to use jQuery to load json data through Ajax request? Thanks   Hi, In Java you can use the following code to crate the json response: JSONObject obj=new JSONObject(); obj.put("name","foo
jQuery Training Course
using jQuery Read more at jQuery Training page... jQuery Training Course     Online jQuery Training course for beginners and experienced web developers
JQuery
JQuery  how to use jquery
JQuery-Selecting class or ID
JQuery-Selecting class or ID  Hi Guys, I am new to JQuery. I am getting little trouble in selecting an item using class or ID in jQuery.... The selected elements can have one or more elements
jQuery questions - Ask jQuery questions
at http://www.roseindia.net/answers/questions/ jQuery Tutorials Read more...jQuery questions - Ask jQuery questions       jQuery questions The jQuery framework
jquery
jquery  What are the Jquery similarities or difference with other java script libraries
JQuery
JQuery  How i begin JQuery and where i begin learning?   Please visit the following link: JQuery Tutorials Learn Jquery from the above link. Here you will get lot of examples with illustration
jquery ajax and servlet
jquery ajax and servlet  hi.. i am using jquery,ajax and servlet... it returns back to the ajax function i load hello.jsp file in the tag but in hello.jsp...) { $("#out").load('hello.jsp',alert("hi")); $("#out1").html(data
jQuery
jQuery  Hi, What is jQuery and how it is used to develop Web applications? Thanks
Example code of jQuery animation
tab Animate with hover jQuery supports many any many more effects also... Example code of jQuery animation       Example code of jQuery animation
jquery
jquery  how to display the leaves taken or holidays of the year or half working days in a calendar in some colors to identify the days using jquery plugin
Using the jQuery Transform plug-in(XSLT)
Using the jQuery Transform plug-in(XSLT)       Using the jQuery Transform plug-in(XSLT... Language Transformations ). The jQuery Plugin we are using
Getting Started with jQuery
the web site more rich. For these reasons jQuery is so popular. jQuery basically...jQuery: jQuery:  jQuery is a JavaScript library which accentuates interaction between JavaScript and HTML. jQuery helps programmers to keep
JQuery
JQuery  hi there, I am just beginner for jQuery and i want to know-what is jQuery ? How it is better than JavaScript ?   jQuery... JavaScript : Each jQuery returns itself so you can chain them together(Chaining
jQuery Training Classes
more at jQuery Training detailed course content page... jQuery Training Classes     Online jQuery Training classes for learning from home or office location
JQuery
JQuery  how to create jquery auto-complete textbox ? in which data come from database table?   Please visit the following link: http://www.roseindia.net/tutorial/jquery/autoSuggestTextbox.html   thank you
jQuery autocomplete with jsonp
jQuery autocomplete with jsonp  I´m trying to develope an autocomplete script using jQuery, now I´m in the last step. I need to make a php page...;&d.length-1<b.B){e=a(this); a(this).trigger("click")}})})}})(jQuery
JQuery
, use jquery autocomplete
JQuery
using url of the doctors, use jquery autocomplete
jQuery UI effects
jQuery UI effects       jQuery UI effects effects.core.js The jQuery UI effects depends heavily on this file  This file is utilizes
jQuery UI Widget : Accordion
jQuery UI Widget : Accordion       jQuery UI Widget : Accordion Using... allow more than one content panel to be open at the same time. The markup
Disabling submit button using jQuery
. Please give code also.   For all submit buttons, via JQuery, it'd... be more useful to do so on form submission: $('form').submit(function... could give a better answer to your question if we knew a bit more about
jQuery Utility Functions
jQuery Utility Functions      In this section we are discussing about jQuery Utility Functions... these funtions very frequently while writing your jQuery application. Here is the list
Spring MVC JQuery Integration
Spring MVC JQuery Integration In this section, you will learn about Spring MVC JQuery Integration by deployment descriptor. PROBLEM When you are including your js file in your view JSP file or adding any jQuery plug in using
Ajax Load
Ajaxload The ajaxload is a tool, which follow web2.0 standard. Due to slow Internet speed or delay some times data takes time to load. At this time we can incorporate an animated gif image, which indicate user for the loading
Replace broken Image using JQuery
code : $(window).bind('load', function() { $('img').each(function
jQuery alert()
jQuery alert() In this section we will discuss about alert box in jQuery.... These information helps user of applications to do tasks further with more... in jQuery helps in to bind the click event, JavaScript event. Example Here I am
jQuery to Show Data Randomly
jQuery to Show Data Randomly       In this first jQuery tutorial we will develop a simple program...;head> <title>AJAX with jQuery Example</title> <script type
Load UIImage from URL
Load UIImage from URL  Load UIImage from URL
how to load pdf on html
how to load pdf on html  how to load pdf on html
JQuery-Disabling element in JQuery.
JQuery-Disabling element in JQuery.   How can we enable/disable an element in JQuery
nsstring load from file
nsstring load from file  Hi, How to load file data into NSString object? Example of nsstring load from file, basically the html file data into NSSTring object. Thanks
UIWebview load url
UIWebview load url  How to load website url in UIWebview? Tell me code for UIWebview load url of a website Thanks...: //Load web view data NSString *strWebsiteUlr = [NSString stringWithFormat:@"http
XML load problem - XML
XML load problem  I have load the xml document in javascript.getting error like ActiveXObject is undefined.Can you help me?  Hi friend... function load(){ var loadXML = new ActiveXObject
Use of "|" separator for selecting more than one path
Use of  "|" separator for selecting more than one path.... It allows you more flexibility by allowing you to execute multiple expressions... to load the document into DOM Document object. We have put that persons.xml file
Load on Startup - JSP-Servlet
Load on Startup  Hi, Can anybody explain the exact use of load-on-startup tag. Where exactly we have to write. Thanks, Naveen  ... of a deployment descriptor is used to load a servlet file when the server starts instead
javascript window.addeventlistener load
javascript window.addeventlistener load  How to load window.addeventlistener in JavaScript?   window.addEventListener('load', function() { var b = document.getElementById('box'), xbox = b.offsetWidth / 2

Ask Questions?

If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.

Ask your questions, our development team will try to give answers to your questions.