ASPForums.Net RSS Feedhttp://www.aspforums.net/Handlers/RSS.ashxLatest additions to the content that appears on ASPForums.Net(c) 2019 www.aspforums.com. All rights reserved.Search and Display result from Database in HTML Table using jQuery AJAX and WebService in ASP.Net<p>Hi<a class="username" rel="jochk12345">jochk12345,</a></p> <p>Check this example. Now please take its reference and correct your code.</p> <p><strong><span style="text-decoration: underline;">Database</span></strong></p> <p>For this example I have used of Northwind database that you can download using the link given below.</p> <p><a href="https://www.aspsnippets.com/Articles/Install-Microsoft-Northwind-and-Pubs-Sample-databases-in-SQL-Server-Management-Studio.aspx">Download Northwind Database</a></p> <p><strong><span style="text-decoration: underline;">HTML</span></strong></p> <pre class="brush: html">&lt;script type=&#34;text/javascript&#34; src=&#34;https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; $(document).ready(function () { ShowProduct(); function ShowProduct() { var productName = window.location.search.split(&#39;=&#39;)[1] == undefined ? &#39;&#39; : window.location.search.split(&#39;=&#39;)[1]; $.ajax({ type: &#34;POST&#34;, url: &#34;WebService.asmx/GetData&#34;, contentType: &#34;application/json;charset=utf-8&#34;, data: &#39;{name:&#34;&#39; + productName + &#39;&#34;}&#39;, dataType: &#34;json&#34;, success: function (data) { $(&#34;#gvProduct&#34;).empty(); if (data.d.length &gt; 0) { $(&#34;#gvProduct&#34;).append(&#34;&lt;tr&gt;&lt;th&gt;Product ID&lt;/th&gt; &lt;th&gt;Product Name&lt;/th&gt;&lt;th&gt;Price&lt;/th&gt;&lt;th&gt; Stock&lt;/th&gt;&lt;/tr&gt;&#34;); for (var i = 0; i &lt; data.d.length; i++) { $(&#34;#gvProduct&#34;).append(&#34;&lt;tr&gt;&lt;td&gt;&#34; + data.d[i].ProductID + &#34;&lt;/td&gt; &lt;td&gt;&#34; + data.d[i].ProductName + &#34;&lt;/td&gt; &lt;td&gt;&#34; + data.d[i].Price + &#34;&lt;/td&gt; &lt;td&gt;&#34; + data.d[i].Stock + &#34;&lt;/td&gt;&lt;/tr&gt;&#34;); } } }, error: function (result) { alert(result.responsetext); } }); } $(&#39;[id*=btnsearch]&#39;).on(&#39;click&#39;, function () { if ($(&#39;[id*=txtsearch]&#39;).val().length &gt; 0) { window.location.href = window.location.pathname + &#34;?Name=&#34; + $(&#39;[id*=txtsearch]&#39;).val(); } else { window.location.href = window.location.pathname; } ShowProduct(); return false; }); }); &lt;/script&gt; &lt;input type=&#34;text&#34; id=&#34;txtsearch&#34; name=&#34;search&#34; /&gt; &lt;input type=&#34;submit&#34; name=&#34;submit&#34; id=&#34;btnsearch&#34; value=&#34;search&#34; /&gt; &lt;table id=&#34;gvProduct&#34;&gt; &lt;tr&gt; &lt;td&gt; ProductID &lt;/td&gt; &lt;td&gt; ProductName &lt;/td&gt; &lt;td&gt; Price &lt;/td&gt; &lt;td&gt; Stock &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt;</pre> <p><strong><span style="text-decoration: underline;">WebService</span></strong></p> <p><strong>C#</strong></p> <pre class="brush: csharp">using System; using System.Collections.Generic; using System.Configuration; using System.Data; using System.Data.SqlClient; using System.Web.Services; /// &lt;summary&gt; /// Summary description for WebService /// &lt;/summary&gt; [WebService(Namespace = &#34;http://tempuri.org/&#34;)] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. [System.Web.Script.Services.ScriptService] public class WebService : System.Web.Services.WebService { [WebMethod] public ProductDetails[] GetData(string name) { List&lt;ProductDetails&gt; MyData = new List&lt;ProductDetails&gt;(); string cmdstring = &#34;SELECT TOP 10 ProductID,ProductName,UnitPrice Price,UnitsInStock Stock FROM Products WHERE ProductName = @Name OR @Name IS NULL&#34;; using (SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings[&#34;connString&#34;].ConnectionString)) { SqlCommand cmd = new SqlCommand(cmdstring, conn); if (!string.IsNullOrEmpty(name)) { cmd.Parameters.AddWithValue(&#34;@Name&#34;, name); } else { cmd.Parameters.AddWithValue(&#34;@Name&#34;, (object)DBNull.Value); } conn.Open(); SqlDataAdapter da = new SqlDataAdapter(cmd); DataTable dt = new DataTable(); da.Fill(dt); foreach (DataRow DR in dt.Rows) { ProductDetails objProduct = new ProductDetails(); objProduct.ProductID = DR[&#34;ProductID&#34;].ToString(); objProduct.ProductName = DR[&#34;ProductName&#34;].ToString(); objProduct.Price = DR[&#34;Price&#34;].ToString(); objProduct.Stock = DR[&#34;Stock&#34;].ToString(); MyData.Add(objProduct); } return MyData.ToArray(); } } public class ProductDetails { public string ProductID { get; set; } public string ProductName { get; set; } public string Price { get; set; } public string Stock { get; set; } } } </pre> <p><strong>VB.Net</strong></p> <pre class="brush: vb">Imports System.Web Imports System.Web.Services Imports System.Web.Services.Protocols Imports System.Configuration Imports System.Data Imports System.Data.SqlClient &#39; To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. &lt;System.Web.Script.Services.ScriptService()&gt; _ &lt;WebService(Namespace:=&#34;http://tempuri.org/&#34;)&gt; _ &lt;WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)&gt; _ &lt;Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()&gt; _ Public Class WebService2 Inherits System.Web.Services.WebService &lt;WebMethod()&gt; Public Function GetData(ByVal name As String) As ProductDetails() Dim MyData As List(Of ProductDetails) = New List(Of ProductDetails)() Dim cmdstring As String = &#34;SELECT TOP 10 ProductID,ProductName,UnitPrice Price,UnitsInStock Stock FROM Products WHERE ProductName = @Name OR @Name IS NULL&#34; Using conn As SqlConnection = New SqlConnection(ConfigurationManager.ConnectionStrings(&#34;connString&#34;).ConnectionString) Dim cmd As SqlCommand = New SqlCommand(cmdstring, conn) If Not String.IsNullOrEmpty(name) Then cmd.Parameters.AddWithValue(&#34;@Name&#34;, name) Else cmd.Parameters.AddWithValue(&#34;@Name&#34;, CObj(DBNull.Value)) End If conn.Open() Dim da As SqlDataAdapter = New SqlDataAdapter(cmd) Dim dt As DataTable = New DataTable() da.Fill(dt) For Each DR As DataRow In dt.Rows Dim objProduct As ProductDetails = New ProductDetails() objProduct.ProductID = DR(&#34;ProductID&#34;).ToString() objProduct.ProductName = DR(&#34;ProductName&#34;).ToString() objProduct.Price = DR(&#34;Price&#34;).ToString() objProduct.Stock = DR(&#34;Stock&#34;).ToString() MyData.Add(objProduct) Next Return MyData.ToArray() End Using End Function Public Class ProductDetails Public Property ProductID As String Public Property ProductName As String Public Property Price As String Public Property Stock As String End Class End Class</pre> <p><strong><span style="text-decoration: underline;">Screenshot</span></strong></p> <p><strong><span style="text-decoration: underline;"><img src="https://i.imgur.com/omtxAw7.gif" alt="" width="424" height="403" /></span></strong></p>https://www.aspforums.net:443/Threads/198490/Search-and-Display-result-from-Database-in-HTML-Table-using-jQuery-AJAX-and-WebService-in-ASPNet/https://www.aspforums.net:443/Threads/198490/Search-and-Display-result-from-Database-in-HTML-Table-using-jQuery-AJAX-and-WebService-in-ASPNet/Mon, 24 Dec 2018 02:56:36 GMT