ajax for .net in vs2003 like gmail
现在ajax挺流行的,其实早就有这玩艺了,记得以前的公司张工利用xmlhttp对象做的,
那时侯还很繁琐,写得一大堆.
上个月在北京的一位朋友告诉我 .net早就有第三方封装的ajax
上msdn 查了一下 结果就看到这个
http://www.schwarz-interactive.de/
Ajax.NET Professional
呵呵,这么早就有了,觉得自己都和时代脱节了
赶快下载下来试验一下,
一直倾心于gmail 可以提示你的输入地址,
如果数据库没有的话,还能把新的记入,下次你就可以不会吹灰之力,很方便
看看步骤
1.首先加入AjaxPro.dll,using它
2. web.config 加一句
<httpHandlers>
<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>
</httpHandlers>
<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>
</httpHandlers>
3.我们看看.cs文件里需要完成什么
4.要注册一下这个类的类型
private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
Utility.RegisterTypeForAjax(typeof( AjaxDemoOwn1.AjaxGetData)); //我这个类的完整namespace
}
{
// 在此处放置用户代码以初始化页面
Utility.RegisterTypeForAjax(typeof( AjaxDemoOwn1.AjaxGetData)); //我这个类的完整namespace
}
5.我们需要从数据库取一些数据出来,做一个数据库的查询,传入参数就是我们敲入的一个个字母,他会去数据库做查询,这样就能实现动态提示了,这里我就用了Northwind库里面customers表,我们就提示名字把!^_^
方法前要加 [AjaxMethod]
[AjaxMethod]
public string getDataByTextBox( string inputString )
{
string temp = "";
if (inputString != "")
{
string mySelectQuery = "SELECT ContactName FROM Customers where ContactName like '" +inputString+"%'";
SqlConnection myConnection = new SqlConnection(@"server=ZTE-WUANCHENG\wuancheng_zte;database=Northwind;User ID=sa;password=;Persist Security Info=true;");
SqlCommand myCommand = new SqlCommand(mySelectQuery,myConnection);
myConnection.Open();
SqlDataReader myReader = myCommand.ExecuteReader();
try
{
while (myReader.Read())
{
temp = temp + myReader.GetString(0)+", " ;
}
}
finally
{
// always call Close when done reading.
myReader.Close();
// always call Close when done reading.
myConnection.Close();
}
}
return temp;
}
public string getDataByTextBox( string inputString )
{
string temp = "";
if (inputString != "")
{
string mySelectQuery = "SELECT ContactName FROM Customers where ContactName like '" +inputString+"%'";
SqlConnection myConnection = new SqlConnection(@"server=ZTE-WUANCHENG\wuancheng_zte;database=Northwind;User ID=sa;password=;Persist Security Info=true;");
SqlCommand myCommand = new SqlCommand(mySelectQuery,myConnection);
myConnection.Open();
SqlDataReader myReader = myCommand.ExecuteReader();
try
{
while (myReader.Read())
{
temp = temp + myReader.GetString(0)+", " ;
}
}
finally
{
// always call Close when done reading.
myReader.Close();
// always call Close when done reading.
myConnection.Close();
}
}
return temp;
}
这个代码是很常规的,相信大家都能看懂
6. 下面完成我们的页面aspx部分
加入2个框
一个text 输入用的
<INPUT type="text" id="Text1" onkeyup="javascript:doTest2();void(0);"
style="Z-INDEX: 102; LEFT: 104px; WIDTH: 200px; POSITION: absolute; TOP: 80px; HEIGHT: 22px"
size="28">
style="Z-INDEX: 102; LEFT: 104px; WIDTH: 200px; POSITION: absolute; TOP: 80px; HEIGHT: 22px"
size="28">
一个text area 提示用的
<TEXTAREA style="Z-INDEX: 103; LEFT: 104px; WIDTH: 200px; POSITION: absolute; TOP: 104px; HEIGHT: 288px"
rows="18" cols="22" id="Text2">
</TEXTAREA>
rows="18" cols="22" id="Text2">
</TEXTAREA>
大家看到了 Text1 有一个 onkeyup 她去调用了 doTest2()这个javascript
<script type="text/javascript" defer>
function doTest2()
{
AjaxDemoOwn1.AjaxGetData.getDataByTextBox(document.getElementById("Text1").value, doTest2_callback);
}
function doTest2_callback(res)
{
var p = res.value;
document.getElementById("Text2").value = p;
}
</script>
function doTest2()
{
AjaxDemoOwn1.AjaxGetData.getDataByTextBox(document.getElementById("Text1").value, doTest2_callback);
}
function doTest2_callback(res)
{
var p = res.value;
document.getElementById("Text2").value = p;
}
</script>
这里就去作异步调用AjaxDemoOwn1.AjaxGetData.getDataByTextBox(string)方法了,
我们就把text1的值传入,得到返回值放入textarea 中,OK !大功告成
页面无刷新,跟着你的按键变化,好爽,^_^
还是很简单的,有兴趣可以看看,下面想作save数据库操作,这样就有记忆能力了!