本篇文章主要介紹PHP+Mysql+jQuery實現的查詢和列表框選擇，感興趣的朋友參考下，希望對大家有所幫助。

本文講解如何通過ajax查詢mysql數據，并將返回的數據顯示在待選列表中，再通過選擇最終將選項加入到已選區，可以用在許多后臺管理系統中。本文列表框的操作依賴jquery插件。

HTML

說明，HTML內容是一個表單，里面放置有一個查詢輸入框，和一個列表框，以及相關按鈕。

MYSQL數據表結構CREATE TABLE IF NOT EXISTS `t_mult` (

`id` int(11) NOT NULL auto_increment,

`username` varchar(32) NOT NULL,

`phone` varchar(20) NOT NULL,

PRIMARY KEY (`id`)

) ENGINE=MyISAM DEFAULT CHARSET=utf8;

表t_mult是一張聯系人資料表，包括姓名和手機號碼字段。

CSS

本例中只加載了Multiselect插件所需的樣式文件，其他CSS大家可以自行設計。

JAVASCRIPT

首先需要引用本例所需的兩個js文件。

接著我們來調用Multiselect插件。$("#liOption").multiselect2side({

selectedPosition: 'right',

moveOptions: false,

labelsx: '待選區',

labeldx: '已選區'

});

然后我們來寫搜索按鈕進行Ajax查詢數據的操作。$("#searchOption").click(function(){

var keys=$("#keys").val();

$.ajax({

type: "POST",

url: "action.php",

data: "title="+keys,

success: function(msg){

if(msg==1){

$("#msg_ser").show().html("沒有記錄！");

}else{

$("#liOptionms2side__sx").html(msg);

$("#msg_ser").html("");

}

}

});

$("#msg_ser").ajaxSend(function(event, request, settings){

$(this).html("");

});

});

說明，當點擊搜索按鈕時，進行的是Ajax異步操作，JAVASCRIPT將獲取的搜索框的輸入值，以POST方式傳遞給后臺程序action.php處理，處理后，返回不同的結果給JAVASCRIPT，如果返回1，HTML頁面會提示“沒有記錄”，反之，則將結果輸出給左邊列表框(待選區)：liOptionms2side__sx。注意關鍵的地方到了，為什么列表框不是XHTML離的liOption，而變成了liOptionms2side__sx了呢？這個要從Multiselect插件說起，Multiselect插件其實就是將一個列表框裝換成左右兩個列表框，已供相關操作，通過查看其插件代碼不難發現，左邊的列表框名為：liOptionms2side__sx，右邊列表框(已選區)名為：liOptionms2side__dx，后面會用到。

PHP

首先來看action.php的處理。

第一步是連接數據庫。$conn=mysql_connect("localhost","root","");

mysql_select_db("demo",$conn);

mysql_query("SET names UTF8");

第二步讀取數據，并輸出。通過檢測搜索框傳來的值，構造不同的SQL語句，并將數據返回輸出，代碼如下：$keys=trim($_POST['title']);

$keys=mysql_real_escape_string($keys,$conn);

if(!empty($keys)){

$sql="select * from t_mult where username like '%$keys%' or phone='$keys'";

}else{

$sql="select * from t_mult";

}

$query=mysql_query($sql);

$count=mysql_num_rows($query);

if($count>0){

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

$str.="".$row['username']."-".$row['phone']."";

}

echo $str;

}else{

echo "1";

}

最后還有一個提交操作，后臺post.php程序來獲取最終提交的項的值。$selID=$_POST['liOptionms2side__dx'];

if(!empty($selID)){

$str=implode(",",$selID);

echo $str;

}else{

echo "沒有選擇任何項目！";

}

總結：以上就是本篇文的全部內容，希望能對大家的學習有所幫助。

相關推薦：

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的php与mysql列表_PHP+Mysql+jQuery实现的查询和列表框选择的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。