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数据库操作,这样就有记忆能力了!