AJAXLoadProgressForm.aspx:
<script src="JS/jquery-1.4.2.js" type="text/javascript"></script> <script type="text/javascript"> function ShowProgressDiv() { var ID = $("input#idtxt").val(); $.ajax({ type: "GET", url: "GetGridViewByConditionForm.aspx", data: "id=" + ID, beforeSend: function() { $("div#ProgressDiv").css("display", "block"); }, success: function(msg) { $("div#ShowSearchResult").html(msg); }, complete: function() { $("div#ProgressDiv").css("display", "none"); ; } }); } </script> <form id="form1" runat="server"> <div> <input type="text" id="idtxt" name="idtxt" /> <input type="button" id="LoadBtn" value="LoadDataGridView" onclick="ShowProgressDiv()" /> </div> <div id="ProgressDiv" style="display:none"> <img alt="Loading" src="Images/ajax-loader.gif" />Loading...... </div> <div id="ShowSearchResult"> </div> </form>
GetGridViewByConditionForm.aspx:
protected void Page_Load(object sender, EventArgs e) { if (Request["id"] != null) { SqlConnection conn=null; SqlCommand cmd = null; SqlDataAdapter adapter = null; try { conn = new SqlConnection(); conn.ConnectionString = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString; conn.Open(); cmd = new SqlCommand(); cmd.Connection = conn; cmd.CommandType = CommandType.Text; String cmdStr = "select * from dbo.Customers"; if (Request["id"].ToString()!=String.Empty) { cmdStr += " where CustomerID= '" + Request["id"].ToString() + "'"; } cmd.CommandText = cmdStr; adapter = new SqlDataAdapter(cmd); DataSet ds = new DataSet(); adapter.Fill(ds); this.gvData.DataSource = ds; this.gvData.DataBind(); } catch { Response.Write("Error happend!"); Response.Flush(); Response.End(); } finally { if (adapter != null) { adapter.Dispose(); } if (cmd != null) { cmd.Dispose(); } if ((conn != null) && (conn.State == ConnectionState.Open)) { conn.Close(); } } } }
More Jquery+ajax request data is displayed on the GridView (asp.net) For related articles, please pay attention to the PHP Chinese website!