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 >

3.我们看看.cs文件里需要完成什么

4.要注册一下这个类的类型

    

   private   void  Page_Load( object  sender, System.EventArgs e)
   {
   // 在此处放置用户代码以初始化页面
   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;
  }

这个代码是很常规的,相信大家都能看懂

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" >

一个text area  提示用的

         < TEXTAREA  style ="Z-INDEX: 103; LEFT: 104px; WIDTH: 200px; POSITION: absolute; TOP: 104px; HEIGHT: 288px"
            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 >

这里就去作异步调用AjaxDemoOwn1.AjaxGetData.getDataByTextBox(string)方法了,
我们就把text1的值传入,得到返回值放入textarea 中,OK !大功告成


页面无刷新,跟着你的按键变化,好爽,^_^

还是很简单的,有兴趣可以看看,下面想作save数据库操作,这样就有记忆能力了!