logo标签列表

使用ajax php mysql实现分页搜索

phpjquerymysqlajaxsearch
3
嘿，伙计们。我正在尝试使用ajax、php、mysql、jquery在网站中实现搜索功能。现在我的应用程序在进入列表页面（网站上的项目列表页面）时运行良好。但是，我在索引页面上有一个搜索，其结果必须显示在列表页面上。基本分页使用php完成，并且对于来自菜单的链接可以正常工作，但是对于搜索失败了（即如果使用搜索查询从索引页面重定向它就无法工作）。
搜索文本框：
        <form name="homePageSearchForm" method="post" action="cities.php" autocomplete="off">
                 <!--   <input type="hidden" value="e.g kolte patil life republic, wagholi pune" id="hiddenExData" name="hiddenExData">-->
                    <div style="padding-top:5px; line-height:20px; width:280px;" class="flt">
                    <div class="flt"><strong>Locality, City, Builder or Project name</strong><span style="color:#FF3300;">*</span><br>
                    <div class="flt"><input type="text" onBlur="if(this.value=='') this.value='e.g kolte patil life republic, wagholi pune';" onFocus="if(this.value=='e.g kolte patil life republic, wagholi pune') this.value='';" value="e.g kolte patil life republic, wagholi pune" name="SearchValue" id="searchId" title="Search" class="headerinput ac_input" autocomplete="off">

列表页面div，在此处显示内容。

            <div class="flt width710" id="displayProp">
            <div style="margin-top:10px;" class="flt mapnewalert"> <?php //echo ucfirst($_SESSION['$city']) ?></div>
            <div style="float:right" id="toppagesel">
            <?php 
                    echo $pages->display_pages();
                    echo $pages->display_items_per_page();
                /*  if(isset($localitySearch) && $localitySearch!='' && isset($citySearch) && $citySearch!='')
                    {
                        $query = "SELECT * from properties inner join cities on properties.city_id=cities.city_id inner join locality on properties.locality_id=locality.locality_id where (cities.city_name like '%".$citySearch."%' and locality.locality_name like '%".$localitySearch."%') and (property_price_min between '78 Lacs' and '80 Lacs') $pages->limit";
                    }*/

                //  else
                //  {
                    $query = "SELECT * from properties,locality,cities where properties.city_id='".$_SESSION['$cityId']."' and properties.locality_id=locality.locality_id and properties.city_id=cities.city_id $pages->limit";
                //  }

                //  echo $query;
                    $result = mysql_query($query) or die(mysql_error());

                    //$getProperty =    $propertyDetails->getPropertyDetailsByCityIdPaginate($_SESSION['$cityId'],$limit);
            ?>
            <?php //echo $pages->display_pages(); ?><?php //echo $pages->display_items_per_page();?>
            </div>
        </div>

现在，当单击搜索按钮时，我调用以下javascript函数
                   <input type="submit" onClick="**handleHomePageSearch(0,'e')**;return false;" value="SEARCH" class="hpnewsubmitbtn">

这个JavaScript函数：

             function handleHomePageSearch(buttonEle,e) {
             var criteria  = document.getElementById("searchCriteria").value;
            var searchVal = document.getElementById("searchId").value;
            xmlHttpSearchct=GetXmlHttpObject();
            var cur_page = document.getElementById("current_page").innerHTML;

            var url="fetchCity.php?&searchVal="+searchVal+"&buttonEle="+buttonEle+"&cur_page="+cur_page;
            alert(url);
            xmlHttpSearchct.open("GET",url,false);

            xmlHttpSearchct.send(null);

                           var Searchres=xmlHttpSearchct.responseText;
                       **//To get the response**
                        xmlhttp.onreadystatechange=function()
          {
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                                    document.getElementById('displayProp').innerHTML=Searchres;
                }
          }

这会以HTML的形式返回响应，但我无法在列表(properties.php)页面上显示它。如果使用搜索值进行浏览，则分页无法正常工作。 < p > < strong > fetchCity.php 包含搜索查询和返回数据的HTML。 

                   $searchValue= $_GET['searchVal'];
$buttonEle  = $_GET['buttonEle'];
$current_page=$_GET['cur_page'];

    $locCity = explode(" ",$searchValue);
    $localitySearch =   $locCity[0];
    $citySearch     =    $locCity[1];

        $query = "SELECT * from properties inner join cities on properties.city_id=cities.city_id inner join locality on properties.locality_id=locality.locality_id where (cities.city_name like '%".$citySearch."%' and locality.locality_name like '%".$localitySearch."%') and (property_price_min between '78 Lacs' and '80 Lacs') $pages->limit";
    //echo $query;
    exit;
    $result = mysql_query($query) or die(mysql_error());


?>


<div class="width710" id="displayProp">

     <?php 


/*print_r($getProperty);
foreach($result as $property)*/
while($row=mysql_fetch_assoc($result))
{
      ?>
            <div class="projectlisttiger">      
            <div class="proptigerhead">PropTiger Recommends</div>   
                <div class="spacer5">&nbsp;</div>
                <div class="listnewimg flt">
                    <a href="p-kolte-patil-cilantro-wagholi-pune.php">
                        <img src="admin/uploads/<?php echo ($row['property_cover_image']) ?>" width="186" height="125" border="0">
                        <img src="admin/uploads/Cilantra1/1cilantra-large.jpg" width="186" height="125" border="0">
                    </a>
                     <div class="newlistlaunch"><a href="p-kolte-patil-cilantro-wagholi-pune.php"><img width="65" height="65" border="0" src="images/projects/kolte-patil/cilantra/new_launch_blue.png"></a>
                     </div>                             
                </div>

                <div class="listright">
                    <div style="width:498px; height:42px;" class="flt">
                        <div class="list-logo flt">
                            <div class="buildborder"><a href="p-kolte-patil-cilantro-wagholi-pune.php"><img width="80" height="36" border="0" align="absmiddle" alt="Kolte Patil" src="admin/uploads/<?php echo $row['builder_logo']?>"></a>
                            </div>
                               <div class="tablistname"><a href="p-kolte-patil-cilantro-wagholi-pune.php"><?php echo $row['property_name'] ?></a></div>
                        </div>   
                        <?php if ($row['property_price_min']!=0) { ?>      
                        <div class="listprice">
                            <img width="18" height="18" align="absmiddle" src="images/city/rupee_icon.gif"> <?php echo $row['property_price_min'] ?> Lacs - <?php echo $row['property_price_max'] ?> Lacs       
                        </div>
                        <?php } else { ?>
                        <div class="listprice">
                             <img width="18" height="18" align="absmiddle" src="images/city/rupee_icon.gif">Price on Request
                        </div>
                        <?php } ?>

                    </div>

                        <div class="spacer3">&nbsp;</div>        SPACER

                    <div class="listbox">
                        <a href="p-kolte-patil-cilantro-wagholi-pune.php"><strong>Address</strong>:<?php echo $row['locality_name'] ?>, <?php echo $row['city_name'] ?><br> <strong>Types</strong>: 2BHK &amp; 3BHK
                        <br><strong>Sizes:</strong> <?php echo $row['property_size_min'] ?> sqft - <?php echo $row['property_size_max'] ?> sqft </a>
                    </div>

                    <div style="margin-left:-3px;" class="flt">
                        <div style="width:110px;" class="flt"><a style="text-decoration:none;" href="p-kolte-patil-cilantro-wagholi-pune.php"><input type="button" value="View Details" class="detail_project"></a>
                        </div>     
                      <div style="width:110px;" class="flt"><input type="button" onClick="showEnqForm('2659','Cilantro'); return false;" value="Enquire Now" class="enquire_project"></div>
                    </div>
                           <div class="spacer">&nbsp;</div>        SPACER                                
                </div>
                <div class="spacer15">&nbsp;</div>                  SPACER
       </div>              

   <?php } 
   exit;

  // echo "<p class=\"paginate\">Page: $pages->current_page of $pages->num_pages</p>\n";
   ?>                         

        <div class="spacer15">&nbsp;</div>
       </div>

我想知道我的方法是否正确？如何在其他页面上显示带有分页的搜索结果。
参考资料：我将添加一个具有类似功能的参考网站链接。
这是链接：http://www.proptiger.com/ 任何建议或帮助都将不胜感激。
分页类：
         class Paginator{
var $items_per_page;
var $items_total;
var $current_page;
var $num_pages;
var $mid_range;
var $low;
var $limit;
var $return;
var $default_ipp;
var $querystring;
var $ipp_array;

function Paginator()
{
    $this->current_page = 1;
    $this->mid_range = 2;
    $this->ipp_array = array(2,4,6,8,10,'All');
    $this->items_per_page = (!empty($_GET['ipp'])) ? $_GET['ipp']:$this->default_ipp;
}

function paginate()
{
    if(!isset($this->default_ipp)) $this->default_ipp='10';
    if($_GET['ipp'] == 'All')
    {
        $this->num_pages = 1;
          //$this->items_per_page = $this->default_ipp;
    }
    else
    {
        if(!is_numeric($this->items_per_page) OR $this->items_per_page <= 0) $this->items_per_page = $this->default_ipp;
        $this->num_pages = ceil($this->items_total/$this->items_per_page);
    }
    $this->current_page = (isset($_GET['page'])) ? (int) $_GET['page'] : 1 ; // must be numeric > 0
    $prev_page = $this->current_page-1;
    $next_page = $this->current_page+1;
    if($_GET)
    {
        $args = explode("&",$_SERVER['QUERY_STRING']);
        foreach($args as $arg)
        {
            $keyval = explode("=",$arg);
            if($keyval[0] != "page" And $keyval[0] != "ipp") $this->querystring .= "&" . $arg;
        }
    }

    if($_POST)
    {
        foreach($_POST as $key=>$val)
        {
            if($key != "page" And $key != "ipp") $this->querystring .= "&$key=$val";
        }
    }
    if($this->num_pages > 4)
    {
        $this->return = ($this->current_page > 1 And $this->items_total >= 10) ? "<a class=\"paginate\" href=\"$_SERVER[PHP_SELF]?page=$prev_page&ipp=$this->items_per_page$this->querystring\">&laquo; Previous</a> ":"<span class=\"inactive\" href=\"#\">&laquo; Previous</span> ";

        $this->start_range = $this->current_page - floor($this->mid_range/2);
        $this->end_range = $this->current_page + floor($this->mid_range/2);

        if($this->start_range <= 0)
        {
            $this->end_range += abs($this->start_range)+1;
            $this->start_range = 1;
        }
        if($this->end_range > $this->num_pages)
        {
            $this->start_range -= $this->end_range-$this->num_pages;
            $this->end_range = $this->num_pages;
        }
        $this->range = range($this->start_range,$this->end_range);

        for($i=1;$i<=$this->num_pages;$i++)
        {
            if($this->range[0] > 2 And $i == $this->range[0]) $this->return .= " ... ";
            // loop through all pages. if first, last, or in range, display
            if($i==1 Or $i==$this->num_pages Or in_array($i,$this->range))
            {
                $this->return .= ($i == $this->current_page And $_GET['page'] != 'All') ? "<a title=\"Go to page $i of $this->num_pages\" class=\"current\" href=\"#\">$i</a> ":"<a class=\"paginate\" title=\"Go to page $i of $this->num_pages\" href=\"$_SERVER[PHP_SELF]?page=$i&ipp=$this->items_per_page$this->querystring\">$i</a> ";
            }
            if($this->range[$this->mid_range-1] < $this->num_pages-1 And $i == $this->range[$this->mid_range-1]) $this->return .= " ... ";
        }
        $this->return .= (($this->current_page < $this->num_pages And $this->items_total >= 10) And ($_GET['page'] != 'All') And $this->current_page > 0) ? "<a class=\"paginate\" href=\"$_SERVER[PHP_SELF]?page=$next_page&ipp=$this->items_per_page$this->querystring\">Next &raquo;</a>\n":"<span class=\"inactive\" href=\"#\">&raquo; Next</span>\n";
        $this->return .= ($_GET['page'] == 'All') ? "<a class=\"current\" style=\"margin-left:10px\" href=\"#\">All</a> \n":"<a class=\"paginate\" style=\"margin-left:10px\" href=\"$_SERVER[PHP_SELF]?page=1&ipp=All$this->querystring\">All</a> \n";
    }
    else
    {
        for($i=1;$i<=$this->num_pages;$i++)
        {
            $this->return .= ($i == $this->current_page) ? "<a class=\"current\" href=\"#\">$i</a> ":"<a class=\"paginate\" href=\"$_SERVER[PHP_SELF]?page=$i&ipp=$this->items_per_page$this->querystring\">$i</a> ";
        }
        $this->return .= "<a class=\"paginate\" href=\"$_SERVER[PHP_SELF]?page=1&ipp=All$this->querystring\">All</a> \n";
    }
    $this->low = ($this->current_page <= 0) ? 0:($this->current_page-1) * $this->items_per_page;
    if($this->current_page <= 0) $this->items_per_page = 0;
    $this->limit = ($_GET['ipp'] == 'All') ? "":" LIMIT $this->low,$this->items_per_page";
}
function display_items_per_page()
{
    $items = '';
    if(!isset($_GET[ipp])) $this->items_per_page = $this->default_ipp;
    foreach($this->ipp_array as $ipp_opt) $items .= ($ipp_opt == $this->items_per_page) ? "<option selected value=\"$ipp_opt\">$ipp_opt</option>\n":"<option value=\"$ipp_opt\">$ipp_opt</option>\n";
    return "<span class=\"paginate\">Items per page:</span><select class=\"paginate\" onchange=\"window.location='$_SERVER[PHP_SELF]?page=1&ipp='+this[this.selectedIndex].value+'$this->querystring';return false\">$items</select>\n";
}
function display_jump_menu()
{
    for($i=1;$i<=$this->num_pages;$i++)
    {
        $option .= ($i==$this->current_page) ? "<option value=\"$i\" selected>$i</option>\n":"<option value=\"$i\">$i</option>\n";
    }
    return "<span class=\"paginate\">Page:</span><select class=\"paginate\" onchange=\"window.location='$_SERVER[PHP_SELF]?page='+this[this.selectedIndex].value+'&ipp=$this->items_per_page$this->querystring';return false\">$option</select>\n";
}
function display_pages()
{
    return $this->return;
}

}

谢谢

告诉我$page是什么，display_pages()在哪里？ - user1432124
这些是分页函数。实际上，我没有将它们添加进去，因为代码已经很大了！我会为它们更新问题，请现在检查。 - KillABug
我的答案中给出的函数没有工作吗？ - user1432124
如果你遇到这样的问题，那么就赚取一些声望分数并在这个问题上开始悬赏。 - user1432124
当您的声望达到60或70左右时，您可以将一些声望分配给回答此问题的用户。顺便说一下，我只有3天的经验。 - user1432124
显示剩余3条评论
2个回答
1
让你的JS函数像这样
function handleHomePageSearch(buttonEle, e) {
    var criteria = document.getElementById("searchCriteria").value;
    var searchVal = document.getElementById("searchId").value;
    xmlHttpSearchct = new XMLHttpRequest();
    var cur_page = document.getElementById("current_page").innerHTML;

    var url = "fetchCity.php?&searchVal=" + searchVal + "&buttonEle=" + buttonEle + "&cur_page=" + cur_page;
    alert(url);

    xmlHttpSearchct.onreadystatechange = function () {
        if (xmlHttpSearchct.readyState == 4 && xmlHttpSearchct.status == 200) {
            document.getElementById('displayProp').innerHTML = xmlHttpSearchct.responseText;
        }
    }
    xmlHttpSearchct.open("GET", url, false);
    xmlHttpSearchct.send(null);
}
我已经编辑了问题，那些都是愚蠢的打字错误，而且在测试时弄乱了它们，但还没有结果。我真的很苦恼@某人。 - KillABug
我会尝试用简单的英语来表达。我添加的Ajax函数可能是导致问题的原因。我想要用fetchCity.php中的搜索结果替换列表（属性）页面上的div，但是保留相同的div，只是根据搜索更改内容。所以，我在firebug中得到了fetchCity查询的响应，但我无法用搜索结果替换列表页面上的div。希望我表述清楚了！我尝试像这样做：document.getElementById('displayProp').innerHTML=Searchres; 但我得到一个空白的div。 - KillABug
1
$(document).ready(function () {
    $('.paginate').live('click', function (e) {
        e.preventDefault();
        var btnPage = $(this);
        $.ajax({
            url: btnPage.attr('href'),
            success: function (resp) {
                // replace current results with new results.
                $('#project_section').html(resp);
            },
            error: function () {
                window.location.href = btnPage.attr('href');
            }
        });
    });
});

这里 $（“.paginate”）是我的分页器类中<li>的类。我已经得到了答案 here，谢谢。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接