使用php和javascript搜索MYSQL并在同一个html表中显示结果

时间:2014-01-30 08:39:40

标签: javascript php jquery html mysql

我有一个下拉如果在下拉列表中选择的值显示html表中关于下拉列表中选择的值的数据,我现在搜索框搜索工作正常它显示结果而不刷新页面,问题现在是在同一页面上显示下拉html表和搜索值结果,但我想在同一个html表上显示搜索结果,请参阅下面的代码,任何人都可以指导我做这件事。

<html>

<select name="client" id="client" style="margin:-8px 0 0 1px;background-color:#E8E8E8;width:104px;position: absolute;"> 
<option value="">Select Client</option>
<?php
i am connection to mysql
$sql=mysql_query("xxxxxxxxxx");
$clientid=$_GET['clientid'];
while($row=mysql_fetch_assoc($sql))
{
if(strlen($_GET['clientid'])>0 && $_GET['clientid']==$row['clientid'])
{
print' <option id="client" name="client" value="'.$row['clientid'].'">'.$row['clientid'].' </option>';
}
else{
print' <option id="client" name="client" value="'.$row['clientid'].'">'.$row['clientid'].' </option>';
}
}
?>
</select>

     <form id="lets_search" action="" style="width:0px;margin:-27px 0 0;text-align:left;">
                   <input type="text" name="region" id="region"> 
                   <input type="text" name="country" id="country">
                   <input type="submit" value="search" name="search" id="search">
          </form>

     <div id="content"></div>

    <table id="CPH_GridView1"  >
    <thead class="fixedHeader">
    <tr>
    <th style=" width:103px">Region  </th>
    <th style=" width:102px" >Country </th>

    <tbody id="fbody" class="fbody" style="width:1660px" >
    <div id="content">
    <?php
    $client_id  = $_POST['title'];
    if($client_id!=""){
    $sql_selectsupplier  = "xxxxxxxxxxx";
    echo '   <td style="width:103px" class=" '.$rows["net_id"].'">'.$rows["clientid"].'</td>
             <td style="width:102px" id="CPH_GridView1_clientid" class=" '.$rows["net_id"].'">'.$rows["region"].'</td>';

    </div>
    </tbody>
    </table>

    </html>

//javascript on the same page

<script type="text/javascript">
      $(function() {
        $("#lets_search").bind('submit',function() {
         var valueregion = $('#region').val();
          var valuecountry = $('#country').val();
          $.post('clientnetworkpricelist/testdb_query.php',{valueregion:valueregion,valuecountry:valuecountry}, function(data){
             $("#content").html(data);
           });
           return false;
        });
      });
    </script>

testdb_query.php

<?php

$dbHost = 'localhost'; // usually localhost
$dbUsername = 'xxxxxx';
$dbPassword = 'xxxxxxxxxxxx';
$dbDatabase = 'xxxxxxxxxxxxxx';
$db = mysql_connect($dbHost, $dbUsername, $dbPassword) or die ("Unable to connect to Database Server.");
mysql_select_db ($dbDatabase, $db) or die ("Could not select database.");

$region=$_POST['valueregion'];
$country=$_POST['valuecountry'];
$clientid=$_POST['clientid'];

if (strlen($region) > 0 && $region!="" ){

                $sql_search.= " AND s.region = '".$region."' ";

                }

if (strlen($country) > 0 && $country!="" ){

                $sql_search.= " AND s.country = '".$country."' ";

                }
$query = mysql_query("SELECT * FROM supplierprice s,$clientid c WHERE s.supp_price_id = c.net_id $sql_search");

echo '<table>';

while ($data = mysql_fetch_array($query)) {

  echo '
  <tr>
        <td style="font-size:18px;">'.$data["region"].'</td>        
    <td style="font-size:18px;">'.$data["country"].'</td>
</tr>';

}

echo '</table>';
?>

2 个答案:

答案 0 :(得分:1)

为了获得最佳实践,将PHP代码与html分开 - 在渲染html之前从数组中获取数据库中的所有数据,并使用html中的foreach来解析每一行。

将数据库登录和连接放在不同的文件中,并在页面顶部使用require_once()包含它

显示错误以更好地理解您的脚本

ini_set('display_errors',1);
ini_set('display_startup_errors',1);
error_reporting(-1);

评论“我连接到mysql”这一行,因为它会以这种格式带来错误

连接到数据库初始化

$sql_search = ""; // otehrwise it will bring a notice when calling "$sql_search.="

并检查http_request,以便在没有$ _POST数据的情况下首次访问页面时不会出现任何错误

if ( $_SERVER['REQUEST_METHOD'] === 'POST')
{
   //code for displaying the new table with the post data
}

答案 1 :(得分:0)

好的,我发现您的HTML代码存在两个问题。一个是你使用两个具有相同ID(“内容”)的html元素,这不是ID的目的。其次,将div放在tbody中是无效的HTML。

根据你的解释,我得知你试图在一张表中显示两个动作的结果。 所以,删除第一个div

    <div id="content"></div>

从$ .post中的代码和更新代码到这样的

    $("#CPH_GridView1").append(data);

另外,删除tbody中的div。