chris710908
 
   
|
分享:
▼
x0
|
1.请先下载jquery档案 http://140.124.90.41...uery.rar2.解压放置网站跟目录资料夹下 PHP+MYSQL动态选单应用（by using Jquery） 一.需求页面：test.php and action.php，test.php是下拉选单部份而action.php是jquery在后台处理下拉选单的页面 二.test.php 首些请于</head>标签前include以下程式码,js我是放在跟目录的jquery下 <script type="text/javascript" src="jquery/jquery.js"></script> <script type="text/javascript" src="jquery/jquery.cascade.js"></script> <script type="text/javascript" src="jquery/jquery.cascade.ext.js"></script> <script type="text/javascript" src="jquery/jquery.templating.js"></script> 页面中的下拉选单有二-->class1选单显示厂商类别名称而c_name选单是依据class1的值显示该类别下的所有厂商名称 原始码解释过程如下： 第一层class1选单程式码复制程式
<select name="class1[]" id="class1">
<option value="">Channel Type</option>
<?php// 资料库设定开始mysql_select_db($database_mio, $mio);
$query = sprintf("SELECT DISTINCT class1 FROM company");//这地方请下sql语法捞出第一层选单资料
$result = mysql_query($query, $mio);//资料库设定结束
//捞出资料库厂商类别的值
while ($row = mysql_fetch_assoc($result)) { echo '<option value="' . $row["class1"] . '">' . $row["class1"] . '</option>' . "\n"; }?></select> 第二层c_name选单程式码这部份只是纯粹做下拉选单即可,他的值会利用jquery回传产生 复制程式
<select name="c_name[]" id="c_name"><option value="">Store Name</option></select> 紧跟在第二层选单后插入jquery语法并送出至action.php作处理 复制程式
<script>
jQuery(document).ready(function(){ $('#c_name').cascade('#class1', {
//前面的c_name表示第二层选单的id,后面的class1表示第一层选单的id
ajax: { type: "GET", url: 'action.php',//传送至action.php
data: { act: 'first', val: $('#class1').val() }//传送变数act与val给action.php作判断与处理 },
template: function(item) { return "<option value='" + item.Value + "'>" + item.Text + "</option>"; },
match: function(selectedValue) { return this.When == selectedValue; } });});</script> 三.action.php程式码解说 复制程式
<?php require_once('Connections/mio.php');//引入资料库连结档 ?>
<?phpheader('Content-Type:text/html;charset=BIG5');
// 资料库设定mysql_select_db($database_mio, $mio);if (!empty($_GET['act']))
{ $action = $_GET['act'];}if (!empty($_GET['val']))
{ $parentId = $_GET['val'];}$list = '[';switch ($action) {
//如果act＝first情况,就将厂商类别为$parentId的厂商捞出来,而这个值就是test.php的第一层下拉选单的值,然后组成jquery的json资料格式然后回传//
case 'first': $query = sprintf("SELECT C_name FROM company WHERE class1= '$parentId' ORDER BY C_name ASC"); $result = mysql_query($query, $mio);
while ($row = mysql_fetch_assoc($result)) { $list .= '{\'When\':\'' . $parentId . '\',\'Value\':\'' . $row["C_name"] . '\',\'Text\':\'' . $row["C_name"] . '\'},';
}
break;
}$list .= ']';
echo $list;?> 以上就是简单的二层动态选单应用 若是要使用三层的话,也是同样的作法在新增一个栏位作jquery 给需要的人作参考.
[ 此文章被chris710908在2008-10-02 13:25重新编辑 ]
此文章被评分,最近评分记录| 财富:100 (by andyz) | 理由: 奖励 | |
|
|
|
|
 x0
[楼 主]
From： | Posted：2008-10-01 23:41 |
|
|
wenzen886
  
|
分享:
▲
▼
 你好 真的非常感谢，还有你那么快就回帖了............. 我的资库联结应该没有问题......因为第一层还连的到......... test会回传 在dev-php中看到 如 get act=first get val=1 我在test和action也都试过，我也改用了你的方式...还是一样的情形....... 我太笨了......... 能不能连资料库的格式栏位也说一下...... 真不好意思......... 谢谢~~~
[ 此文章被wenzen886在2008-10-10 11:13重新编辑 ]
|
|
|
x0
[3 楼]
From：台湾固网公司 | Posted：2008-10-10 10:11 |
|
|
wenzen886
|
分享:
▲
▼
你好~~~
那就麻烦你了.....
test.php
<html>
<?php require_once('mio.php');//引入资料库连结档 ?>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<title>新增网页1</title>
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript" src="jquery/jquery.cascade.js"></script>
<script type="text/javascript" src="jquery/jquery.cascade.ext.js"></script>
<script type="text/javascript" src="jquery/jquery.templating.js"></script>
</head>
<body>
<select name="class1[]" id="class1">
<option value="">Channel Type</option>
<?php
mysql_select_db($database_mio, $mio);
$query = sprintf("SELECT DISTINCT class1 FROM company");
$result = mysql_query($query, $mio);//资料库设定结束
//捞出资料库厂商类别的值
while ($row = mysql_fetch_assoc($result)) { echo '<option value="' . $row["class1"] . '">' . $row["class1"] . '</option>' . "\n"; }?></select>
<select name="c_name[]" id="c_name"><option value="">Store Name</option></select>
<script>
jQuery(document).ready(function(){ $('#c_name').cascade('#class1', {
ajax: { type: "GET", url: 'action.php',
data: { act: 'first', val: $('#class1').val() } },
template: function(item) { return "<option value='" + item.Value + "'>" + item.Text + "</option>"; },
match: function(selectedValue) { return this.When == selectedValue; } });});</script>
</body>
</html>
以下是action.php
<?php require_once('mio.php');//引入资料库连结档 ?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<title>新增网页1</title>
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript" src="jquery/jquery.cascade.js"></script>
<script type="text/javascript" src="jquery/jquery.cascade.ext.js"></script>
<script type="text/javascript" src="jquery/jquery.templating.js"></script>
</head>
<body>
<?header('Content-Type:text/html;charset=BIG5');
// 资料库设定
mysql_select_db($database_mio, $mio);if (!empty($_GET['act']))
{ $action = $_GET['act'];}if (!empty($_GET['val']))
{ $parentId = $_GET['val'];}$list = '[';switch ($action) {
//如果act＝first情况,就将厂商类别为$parentId的厂商捞出来,而这个值就是test.php的第一层下拉选单的值,然后组成jquery的json资料格式然后回传//
case 'first': $query = sprintf("SELECT C_name FROM company WHERE class1= '$parentId' ORDER BY C_name ASC"); $result = mysql_query($query, $mio);
while ($row = mysql_fetch_assoc($result)) { $list .= '{\'When\':\'' . $parentId . '\',\'Value\':\'' . $row["C_name"] . '\',\'Text\':\'' . $row["C_name"] . '\'},';
}
break;
}$list .= ']';
#
# 资料表格式： `company`
#
CREATE TABLE `company` (
`id` int(11) NOT NULL,
`C_name` varchar(32) default NULL,
`grade` int(5) NOT NULL,
`class1` int(5) default NULL,
`no` int(5) NOT NULL,
`sex` varchar(5) NOT NULL,
`s_id` int(10) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;
#
# 列出以下资料库的数据： `company`
#
INSERT INTO `company` VALUES (1101, '柯刘育', 1, 2, 3, '', 0);
INSERT INTO `company` VALUES (1102, '林钲杰', 2, 5, 45, '', 0);
INSERT INTO `company` VALUES (1103, '钟意详', 3, 5, 7, '', 0);
INSERT INTO `company` VALUES (1104, '庄仲成', 3, 7, 22, '', 0);
INSERT INTO `company` VALUES (1105, '萧峻铭', 2, 2, 6, '', 0);
echo $list;?>
我本来想用在学校的，可以找出年级、班级再对应到学生姓名
我先用两层的试试..试该不会和mysql的编码有关吧???.
谢谢~~~~~
[ 此文章被wenzen886在2008-10-10 15:41重新编辑 ]
|
|
|
x0
[5 楼]
From：台湾固网公司 | Posted：2008-10-10 15:27 |
|
|
chris710908
|
分享:
▲
▼
图 1.
 我自己建立资料表.test.php 跟action.php 请按照我的步骤作.一定可以 1.进入mysql控制页面,新建资料库test并输入资料表语法 复制程式
CREATE TABLE `company` (
`id` int(11) NOT NULL,
`C_name` varchar(32) default NULL,
`grade` int(5) NOT NULL,
`class1` int(5) default NULL,
`no` int(5) NOT NULL,
`sex` varchar(5) NOT NULL,
`s_id` int(10) NOT NULL,
PRIMARY KEY (`id`)
);
2.请确认跟目录下有connection资料夹,里面有mio.php.此为连接资料库档案.这部分请确认无误.否则跑不出来 复制程式
<?php
# FileName="Connection_php_mysql.htm"
# Type="MYSQL"
# HTTP="true"
$hostname_mio = "localhost";//预设为localhost
$database_mio = "...";//填入mysql资料库名称
$username_mio = "...";//mysql 帐号
$password_mio = "...";//mysql密码
$mio = mysql_pconnect($hostname_mio, $username_mio, $password_mio) or trigger_error(mysql_error(),E_USER_ERROR);
?>
3.test.php 复制程式
<?php require_once('Connections/mio.php');//引入资料库连结档 ?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<title>新增网页1</title>
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript" src="jquery/jquery.cascade.js"></script>
<script type="text/javascript" src="jquery/jquery.cascade.ext.js"></script>
<script type="text/javascript" src="jquery/jquery.templating.js"></script>
</head>
<body>
<select name="class1[]" id="class1">
<option value="">Channel Type</option>
<?php
mysql_select_db($database_mio, $mio);
$query = sprintf("SELECT DISTINCT class1 FROM company");
$result = mysql_query($query, $mio);//资料库设定结束
//捞出资料库厂商类别的值
while ($row = mysql_fetch_assoc($result)) { echo '<option value="' . $row["class1"] . '">' . $row["class1"] . '</option>' . "\n"; }?></select>
<select name="c_name[]" id="c_name"><option value="">Store Name</option></select>
<script>
jQuery(document).ready(function(){ $('#c_name').cascade('#class1', {
ajax: { type: "GET", url: 'action.php',
data: { act: 'first', val: $('#class1').val() } },
template: function(item) { return "<option value='" + item.Value + "'>" + item.Text + "</option>"; },
match: function(selectedValue) { return this.When == selectedValue; } });});</script>
</body>
</html>
action.php 复制程式
<?php require_once('Connections/mio.php'); ?>
<?php
header('Content-Type:text/html;charset=BIG5');
// 资料库设定
mysql_select_db($database_mio, $mio);
if (!empty($_GET['act'])) {
$action = $_GET['act'];
}
if (!empty($_GET['val'])) {
$parentId = $_GET['val'];
}
$list = '[';
switch ($action) {
case 'first':
$query = sprintf("SELECT DISTINCT C_name FROM company WHERE class1= '$parentId' AND C_name!='' ORDER BY C_name ASC");
$result = mysql_query($query, $mio);
while ($row = mysql_fetch_assoc($result)) {
$list .= '{\'When\':\'' . $parentId . '\',\'Value\':\'' . $row["C_name"] . '\',\'Text\':\'' . $row["C_name"] . '\'},';
}
break;
}
$list .= ']';
echo $list;
?>
在我电脑都有跑出来.你试试看吧
|
|
|
x0
[8 楼]
From： | Posted：2008-10-12 16:17 |
|
|
|
