jquery 实现类似于onchange()事件,但我给控件定义了onchange却不能让该控件值一有改变就调用后台方法
我就是不想用jquery autocomplete插件,因为该插件是似访问不了MVC3后台的action 展开
有图有真像!!!!!!!!!!!!!!!!!!!!!!!!!!11111111
方法:
1..aspx
User ID <asp:TextBox ID="txt_UserID" runat="server" AutoCompleteType="Disabled" ></asp:TextBox>
2.jquery
<script type="text/javascript">
$(function(){
var $mydiv= $("<div id='employeeList' style='margin:0 0 0 0;padding:0 0 0 0;z-index:10;'></div>");
$mydiv.appendTo("body").hide().css({position:"absolute",backgroundColor:"AliceBlue",border:"solid 1px Green",left:$("input[id*='txt_UserID']").offset().left,top:$("input[id*='txt_UserID']").offset().top+23});
$("input[id*='txt_UserID']").keyup(function(){
if($.trim($(this).val())!="")
{
$(this).val($(this).val().toUpperCase());
$.post("Handler.ashx",{type:"GetEmployeeList",id:$("input[id*='txt_UserID']").val()},function(data){
$("ul","#employeeList").remove();
$(data).appendTo("#employeeList").css({listStyleType:"none",margin:"0 0 0 0",padding:"2 2 2 2"})
.find("a").attr("href","javascript:void(0);").css({textDecoration:"none",display:"block"}).click(function(){
$("input[id*='txt_UserID']").val($(this).text().substr(0,11));
$mydiv.hide();
}).mouseover(function(){$(this).css({backgroundColor:"#99aa99"});c=this.style.color;this.style.color='White';h=this.style.lineHeight;this.style.lineHeight='1.5em';}).mouseout(function(){$(this).css({backgroundColor:"AliceBlue"});this.style.color=c;this.style.lineHeight=h;});
});
$mydiv.show();
}
else
{
$("ul","#employeeList").remove();
$mydiv.hide();
}
});
$("body").click(function(){$mydiv.hide();});
});
</script>
3.新建一个Handler.ashx一般处理文件
<%@ WebHandler Language="C#" Class="Handler" %>
using System;
using System.Web;
public class Handler : IHttpHandler {
/// <summary>
/// only for Ajax
/// ---Jeanson---
/// 2011-11-12
/// </summary>
/// <param name="context"></param>
public void ProcessRequest (HttpContext context) {
if (!string.IsNullOrEmpty(context.Request["type"]))
{
switch (context.Request["type"].ToString().Trim())
{
case "GetEmployeeList":
context.Response.Write(DAL.Utility.Ajax.GetEmployeeList(context.Request["id"].ToString()));
break;
}
context.Response.ContentType = "text/plain";
}
}
public bool IsReusable {
get {
return false;
}
}
}
4.新建 一个Ajax.cs
public class Ajax
{
public Ajax()
{
}
public static string GetEmployeeList(string data)
{
string strcmd = "select top 15 sys_emp_id_nr+emp_na as fullname from chart..upsemployee where emp_emt_sts_cd!='t' and ";
Regex regExp = new Regex(@"^\d.");
if (regExp.IsMatch(data))
{
strcmd += " sys_emp_id_nr like '%" + data + "%'";
}
else
{
strcmd += " racfid like '" + data + "%'";
}
using (SqlConnection conn = new SqlConnection(H_Config.Config.ConnectionString()))
{
SqlDataAdapter da = new SqlDataAdapter(strcmd, conn);
DataTable dt = new DataTable();
dt.Clear();
da.Fill(dt);
System.Text.StringBuilder sb = new System.Text.StringBuilder();
sb.Append("<ul>");
foreach (DataRow dr in dt.Rows)
{
sb.Append("<li><a>");
sb.Append(dr[0].ToString());
sb.Append("</a></li>");
}
sb.Append("</ul>");
return sb.ToString();
}
}
}
onchage的事件是要失去焦点的时候才触发的,或者用onkeydown
你还是用jquery的插件吧,你搜下jquery autocomplete吧,相信我,绝对比你自己写的好用
广告 您可能关注的内容 |