求一段js代码,2个listbox的问题
需求是这样的,我现在有两个listbox,1和2 ,我想点一下1中的任何一个item,然后去数据库中去搜col列符合选中的那个值的所有 符合条件记
录的某一列(col_ok)列,显示在2中。如果我要点1中的其他值,2中相应的跟着变化。(数据库配合方面可以简单的说一下就ok了,这个我到会)
最好能把关键的步骤都列一下,谢谢了,
[解决办法]
用ajax
[解决办法]
如果不用 ajax 的话
就用 change服务器事件吧
[解决办法]
要求无刷?要是不要求
直接ListBox 属性AutoPostBack= "True "
在后台事件里写就行了
protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e)
{
根据ListBox1值绑定listbox2
}
[解决办法]
www.asp.net去下
[解决办法]
http://ajax.asp.net/default.aspx?tabid=47
[解决办法]
不是
[解决办法]
理解错了!
那个不行!刷新!
你自己查查 XMLHTTP资料
自己写 不用什么框架
[解决办法]
到底要不要刷新?刷的话
直接ListBox 属性AutoPostBack= "True "
在后台事件里写就行了
protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e)
{
根据ListBox1值绑定listbox2
}
如果要无刷的话用ajax技术把根新数据取到客户端 用JS根新listbox2
[解决办法]
楼上总结的很好
[解决办法]
同上上
[解决办法]
同 chy3503319(东北车神)
[解决办法]
参考一下这个
--aspx
<%@ Page language= "c# " Codebehind= "WebForm1.aspx.cs " AutoEventWireup= "false " Inherits= "AjaxTest.WebForm1 " %>
<HTML>
<HEAD>
<title> Ajax实现无刷新三联动下拉框 </title>
<meta content= "Microsoft Visual Studio .NET 7.1 " name= "GENERATOR ">
<meta content= "C# " name= "CODE_LANGUAGE ">
<meta content= "JavaScript " name= "vs_defaultClientScript ">
<meta content= "http://schemas.microsoft.com/intellisense/ie5 " name= "vs_targetSchema ">
<SCRIPT language= "javascript ">
//城市------------------------------
function cityResult()
{
var city=document.getElementById( "DropDownList1 ");
AjaxMethod.GetCityList(city.value,get_city_Result_CallBack);
}
function get_city_Result_CallBack(response)
{
if (response.value != null)
{
//debugger;
document.all( "DropDownList2 ").length=0;
var ds = response.value;
if(ds != null && typeof(ds) == "object " && ds.Tables != null)
{
for(var i=0; i <ds.Tables[0].Rows.length; i++)
{
var name=ds.Tables[0].Rows[i].city;
var id=ds.Tables[0].Rows[i].cityID;
document.all( "DropDownList2 ").options.add(new Option(name,id));
}
}
}
return
}
//市区----------------------------------------
function areaResult()
{
var area=document.getElementById( "DropDownList2 ");
AjaxMethod.GetAreaList(area.value,get_area_Result_CallBack);
}
function get_area_Result_CallBack(response)
{
if (response.value != null)
{
document.all( "DropDownList3 ").length=0;
var ds = response.value;
if(ds != null && typeof(ds) == "object " && ds.Tables != null)
{
for(var i=0; i <ds.Tables[0].Rows.length; i++)
{
var name=ds.Tables[0].Rows[i].area;
var id=ds.Tables[0].Rows[i].areaID;
document.all( "DropDownList3 ").options.add(new Option(name,id));
}
}
}
return
}
function getData()
{
var province=document.getElementById( "DropDownList1 ");
var pindex = province.selectedIndex;
var pValue = province.options[pindex].value;
var pText = province.options[pindex].text;
var city=document.getElementById( "DropDownList2 ");
var cindex = city.selectedIndex;
var cValue = city.options[cindex].value;
var cText = city.options[cindex].text;
var area=document.getElementById( "DropDownList3 ");
var aindex = area.selectedIndex;
var aValue = area.options[aindex].value;
var aText = area.options[aindex].text;
var txt=document.getElementById( "TextBox1 ");
document.getElementById( " <%=TextBox1.ClientID%> ").innerText= "省: "+pValue+ "| "+pText+ "市: "+cValue+ "| "+cText+ "区: "+aValue+ "| "+aText;
}
</SCRIPT>
</HEAD>
<body ms_positioning= "GridLayout ">
<form id= "Form1 " method= "post " runat= "server ">
<TABLE id= "Table1 " style= "Z-INDEX: 101; LEFT: 96px; POSITION: absolute; TOP: 32px " cellSpacing= "1 "
cellPadding= "1 " width= "300 " border= "1 ">
<TR>
<TD> 省市 </TD>
<TD> <asp:dropdownlist id= "DropDownList1 " runat= "server "> </asp:dropdownlist> </TD>
</TR>
<TR>
<TD> 城市 </TD>
<TD> <asp:dropdownlist id= "DropDownList2 " runat= "server "> </asp:dropdownlist> </TD>
</TR>
<TR>
<TD> 市区 </TD>
<TD> <asp:dropdownlist id= "DropDownList3 " runat= "server "> </asp:dropdownlist> </TD>
</TR>
<tr>
<td>
<table id= "oCity ">
</table>
</td>
<td> <table id= "oArea ">
</table>
</td>
</tr>
</TABLE>
<asp:TextBox id= "TextBox1 " style= "Z-INDEX: 102; LEFT: 416px; POSITION: absolute; TOP: 48px " runat= "server "
Width= "424px "> </asp:TextBox> <INPUT style= "Z-INDEX: 103; LEFT: 456px; WIDTH: 56px; POSITION: absolute; TOP: 96px; HEIGHT: 24px "
type= "button " value= "test " onclick= "getData(); ">
</form>
</body>
</HTML>
[解决办法]
--AjaxMethod.cs
using System;
using System.Data;
using System.Data.SqlClient;
namespace AjaxTest
{
/// <summary>
/// Summary description for AjaxMethod.
/// </summary>
public class AjaxMethod
{
#region GetProvinceList
public static DataSet GetProvinceList()
{
string sql= "select * from province ";
return GetDataSet(sql);
}
#endregion
#region GetCityList
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
public DataSet GetCityList(int provinceid)
{
string sql= "select * from city where father= "+provinceid;
return GetDataSet(sql);
}
#endregion
#region GetAreaList
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
public DataSet GetAreaList(int cityid)
{
string sql= "select * from area where father= "+cityid;
return GetDataSet(sql);
}
#endregion
#region GetDataSet
public static DataSet GetDataSet(string sql)
{
string ConnectionString=System.Configuration.ConfigurationSettings.AppSettings[ "ConnectionString "];
SqlDataAdaptersda =new SqlDataAdapter(sql,ConnectionString);
DataSet ds=new DataSet();
sda.Fill(ds);
return ds;
}
#endregion
}
}
[解决办法]
--后台cs
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace AjaxTest
{
/// <summary>
/// Summary description for WebForm1.
/// </summary>
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DropDownList DropDownList1;
protected System.Web.UI.WebControls.DropDownList DropDownList2;
protected System.Web.UI.WebControls.TextBox TextBox1;
protected System.Web.UI.WebControls.DropDownList DropDownList3;
private void Page_Load(object sender, System.EventArgs e)
{
Ajax.Utility.RegisterTypeForAjax(typeof(AjaxMethod));
if(!Page.IsPostBack)
{
this.DropDownList1.DataSource=AjaxMethod.GetProvinceList();
this.DropDownList1.DataTextField= "province ";
this.DropDownList1.DataValueField= "provinceID ";
this.DropDownList1.DataBind();
this.DropDownList1.Attributes.Add( "onclick ", "cityResult(); ");
this.DropDownList2.Attributes.Add( "onclick ", "areaResult(); ");
}
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web Form Designer.
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// Required method for Designer support - do not modify
/// the contents of this method with the code editor.
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
[解决办法]
路过
[解决办法]
需引用Ajax.dll
web.config需加上
<httpHandlers>
<add verb= "POST,GET " path= "ajax/*.ashx " type= "Ajax.PageHandlerFactory, Ajax " />
</httpHandlers>
[解决办法]
研究下```