您的位置:首页 > Web前端 > JQuery

jquery 下拉框联动(1)

2010-05-25 10:40 295 查看
由于项目中好多地方要用到两个同样的下拉框,也避免多个页面写同样的方法,采用jquery来实现很方便,

在每个调用的页面只需写js就可以实现。

方法一:jquery ajax

html 页面

<div ID="ddlSummary">
<select id="ddlCompany">
</select>
<select id="ddlFund">
</select>
</div>

js:

<script type="text/javascript">

//初始化加载基金公司
$.ajax({
url: "/Inc/Ajax_Data.aspx",
type: "get",
dataType: "html",
cache: false,
data: "method=GetFundCompany",
success: function(html) {
$("#ddlCompany").append(html);
}
});

$(document).ready(function() {

$('#ddlCompany').change(function() {//变更事件

GetData();

});
});

function GetData() {//选择基金
var id = $('#ddlCompany').val();
$.ajax({
url: "/Inc/Ajax_Data.aspx",
type: "get",
dataType: "html",
cache: false,
data: "method=GetFundList&ID=" + id,
success: function(html) {
$("#ddlFund").empty();//清空
$("#ddlFund").append(html);
}
});
}
</script>

cs文件:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using AASmart.Financier.Interface;

namespace AASmart.Financier.Web.Inc.System
{
public partial class Ajax_Data : BasePage
{
protected void Page_Load(object sender, EventArgs e)
{
string result = "";
string method = Request["method"];
if (!string.IsNullOrEmpty(method))
{
switch (method)
{

case "GetFundNetVal":
result = GetFundNetVal();
break;
case "GetFundCompany":
result = GetFundCompany();
break;
case "GetFundList":
result = GetFundListInfo();
break;
}
}
Response.Write(result);
}

public string GetFundCompany()
{
string html = string.Empty;
DataSet ds =GetList();
foreach (DataRow dr in ds.Tables[0].Rows)
{
html += "<option value=/"" + dr["id"] + "/">" + dr["CName"] + "</option>";
}
return html;
}

public string GetFundListInfo()
{
string ClassId=Request["ID"];
DataSet ds = GetData();
string ret = "";
//ret = "0-请选择基金..";
foreach (DataRow dr in ds.Tables[0].Rows)
{
ret += "<option value=/"" + dr["jcode"] + "/">" + dr["title"] + "</option>";
}
return ret;
}

}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: