Jquery调用存储过程实例

      Jquery对AJAX的简写操作实例，仅供给初学者学习。一般为2种方法，将方法总结为最简单的方法。POST /GET

 

页面代码如下：

   < title >Jquery 调用存储过程实例 </ title >
   < script src = " jquery.min.js "  language = " javascript "   type = " text/javascript "   ></ script >
   < script language = " javascript "   type = " text/javascript "   >
   $.ajaxSetup({
    url: " HttpResponseHandlerSam.ashx " ,  
    success:function(data){
    $( " #responseServerData " ).html(decodeURI(data)); // 显示内容
    } 
   });
    
    function  createQueryString(){ // 传递参数
    var firstN = encodeURI($( " #firstName " ).val());
    var secondN = encodeURI($( " #secondName " ).val());
    var number = encodeURI($( " #number " ).val());
    //  var queryString={firstName:firstN,secondName:secondN};   
    var queryString = " firstName= " + firstN + " &secondName= " + secondN + " &number= " + number ;
     return  queryString;
    }
    
    function getDataByPost(){
   //   $.post("HttpResponseHandlerSam.ashx",createQueryString(),function(data){
   //   $("#responseServerData").html(decodeURI(data)); // take care of decodeURI not encodeURI 
   //   });
  $.ajax({  // take care of  $.ajax({ properties })
    type: " POST " ,
   ///    url:"HttpResponseHandlerSam.ashx",  
    data:createQueryString()
   ///    success:function(data){
   ///   $("#responseServerData").html(decodeURI(data));//take care of decodeURI not encodeURI 
   ///   }
  });
    }  
    function getDataByGet(){
    //  $.get("HttpResponseHandlerSam.ashx",createQueryString(),function(data){ 
    //  $("#responseServerData").html(decodeURI(data));    
    //  });
    $.ajax({
    type: " GET " ,
    /// url:"HttpResponseHandlerSam.ashx",  
    data:createQueryString()
   ///  success:function(data){
   ///  $("#responseServerData").html(decodeURI(data));//take care of decodeURI not encodeURI 
   ///   }
    }  )}
     </ script >
</ head >
< body >
     < form id = " form1 "  runat = " server " >
     < div >
     < div >
     < input  type = " text "  id = " firstName "    />< br  />
     < input  type = " text "  id = " secondName "    />< br  />
     < input  type = " text "  id = " number "    />
     </ div >
     < div >
     < input  type = " button "  value = " Post "  onclick = " getDataByPost(); "  id = " btnPost " />
         & nbsp;  & nbsp;  & nbsp; < input  type = " button "  value = " Get "  onclick = " getDataByGet(); " />< br  />
         < div id = " responseServerData " ></ div >
     </ div >
     </ div >
     </ form >
</ body >
</ html >

 

 

存储过程代码：

create  procedure GetDataSam(
@number  int  
)
as  
begin   
declare @str nvarchar( 200 );
set    @str = ' select top  ' + cast(@number   as   nvarchar) +   ' title  from  zhq_in_content    order by  createdate   desc ' ;
exec(@str);
end

 

 

一般处理文件代码HttpResponseHandlerSam.ashx：代码如下

<% @ WebHandler Language = " C# "  Class = " HttpResponseHandlerSam "     %>

using  System;
using  System.Web;
using  System.Text;


using  System.Data;
using  System.Data.SqlClient;

public   class  HttpResponseHandlerSam : IHttpHandler {

     public   void  ProcessRequest(HttpContext context)
    {
        context.Response.ContentType  =   " text/plain " ;
         //  context.Response.HeaderEncoding = "gb2312";
         int  num  =   int .Parse(context.Request[ " number " ].ToString());
         if  (context.Request.HttpMethod  ==   " POST " )
        {
            DataSet ds  =   new  DataSet();
            SqlConnection conn  =   new  SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings[ " foretech " ].ToString());
             try
            {
                conn.Open();
                SqlDataAdapter da  =   new  SqlDataAdapter( " GetDataSam " , conn);
                da.SelectCommand.CommandType  =  CommandType.StoredProcedure;
                SqlParameter para  =   new  SqlParameter( " @number " , num);
                para.Direction  =  ParameterDirection.Input;
                da.SelectCommand.Parameters.Add(para);
                da.Fill(ds);
            }
             catch  (Exception ex)
            {
                context.Response.Write(ex.ToString());
            }
             finally
            {
                conn.Close();

            }
            StringBuilder sb  =   new  StringBuilder();
             if  (ds  !=   null   &&  ds.Tables[ 0 ].Rows.Count  >   0 )
            {
                 for  ( int  i  =   0 ; i  <  ds.Tables[ 0 ].Rows.Count; i ++ )
                {
                     if  (sb.ToString()  ==   "" )
                    {
                        sb.Append(ds.Tables[ 0 ].Rows[i][ " title " ].ToString());
                    }
                     else
                    {
                        sb.Append( " <br/> " ).Append(ds.Tables[ 0 ].Rows[i][ " title " ].ToString());
                    }
                }
            }
            context.Response.Write( " POST:firstName "   +  context.Request[ " firstName " ]  +   " <br>secondName-- "   +  context.Request[ " secondName " ] + " <br/> " + sb.ToString());
        }
         if  (context.Request.HttpMethod  ==   " GET " )
        {
            context.Response.Write( " GET:firstName "   +  context.Request[ " firstName " ]  +   " <br>secondName-- "   +  context.Request[ " secondName " ]);
        }
    }
 
     public   bool  IsReusable {
         get  {
             return   false ;
        }
    }

}

 

     方法没分离了，最通俗易懂的代码...

     上一篇以及这一篇的源代码如下，仅供参考。。。。

/Files/jasenkin/AjaxSamp.rar