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.Populate ListBox using jQuery AJAX and apply Bootstrap MultiSelect plugin in ASP.Net<p>Hi <a class="username" rel="veenahosur">veenahosur</a>,<br /><br />Please refer the below link for your referece how to bind data to listbox in jquery.<br /><br /></p> <h1 class="header"><a title="Populate (Bind) ASP.Net ListBox using jQuery AJAX and JSON in C# and VB.Net'a" href="http://www.aspsnippets.com/Articles/Populate-Bind-ASPNet-ListBox-using-jQuery-AJAX-and-JSON-in-C-and-VBNet.aspx">Populate (Bind) ASP.Net ListBox using jQuery AJAX and JSON in C# and VB.Net</a></h1>https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/Wed, 07 Dec 2016 04:52:58 GMTPopulate ListBox using jQuery AJAX and apply Bootstrap MultiSelect plugin in ASP.Net<p>&nbsp;HI,</p> <p>this what i am trying but i am not getting values in listbox</p> <pre class="brush: csharp"> [WebMethod] public List&lt;industrialareadetails&gt; GetPlotsbyReservation(String District, String industry, String rsvr) { industrialareadetails industrialareadetails = new industrialareadetails(); List&lt;industrialareadetails&gt; plno = new List&lt;industrialareadetails&gt;(); DataTable dt = industrialdetailsBL.GetPlotsbyReservation(District, industry,rsvr); for (int i = 0; i &lt; dt.Rows.Count; i++) { industrialareadetails.plno = dt.Rows[i][&#34;plno&#34;].ToString(); plno.Add(industrialareadetails); } return plno; }</pre> <p>&nbsp;</p> <pre class="brush: csharp"> public class industrialareadetails { public string plno { get; set; } }</pre> <p>&nbsp;</p> <pre class="brush: js"> function OnSuccess(data, status) { var lstPlot = $(&#34;[id*=ddlPlot]&#34;); lstPlot.empty(); $.each(data.d, function () { lstPlot.append($(&#34;&lt;option&gt;&lt;/option&gt;&#34;).val(this[&#39;plno&#39;]).html(this[&#39;plno&#39;])); }); } function OnError(request, status, error) { alert(request.statusText); }</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/Wed, 07 Dec 2016 21:57:30 GMTPopulate ListBox using jQuery AJAX and apply Bootstrap MultiSelect plugin in ASP.Net<p>Hi,</p> <p>thank you .i am getting value but without bootstrap plugins&nbsp;</p> <p>this is code i am using to bind:</p> <p>&nbsp;</p> <pre class="brush: csharp"> [WebMethod] public List&lt;industrialareadetails&gt; GetPlotsbyReservation(String District, String industry, String rsvr) { DataTable dt = industrialdetailsBL.GetPlotsbyReservation(District, industry,rsvr); List&lt;industrialareadetails&gt; list = new List&lt;industrialareadetails&gt;(); // Employee should contain EmployeeId, EmployeeName as properties for (int i = 0; i &lt; dt.Rows.Count; i++) { industrialareadetails industrialareadetails = new industrialareadetails(); industrialareadetails.Value = dt.Rows[i][&#34;plno&#34;].ToString(); industrialareadetails.Text = dt.Rows[i][&#34;plno&#34;].ToString(); list.Add(industrialareadetails); } return list; } public class industrialareadetails { public string Value { get; set; } public string Text { get; set; } }</pre> <p>&nbsp;</p> <pre class="brush: js"> function GetPlotsbyReservation(district, industry, rsvr) { alert(rsvr); $.ajax({ type: &#34;POST&#34;, url: &#34;kiadb.asmx/GetPlotsbyReservation&#34;, data: &#34;{&#39;District&#39;:&#39;&#34; + district + &#34;&#39;,&#39;industry&#39;:&#39;&#34; + industry + &#34;&#39;,&#39;rsvr&#39;:&#39;&#34; + rsvr + &#34;&#39;}&#34;, contentType: &#34;application/json; charset=utf-8&#34;, dataType: &#34;json&#34;, success: OnSuccess, error: OnError }); function OnSuccess(r) { var lstCustomers = $(&#34;[id*=ddlPlot]&#34;); lstCustomers.empty(); $.each(r.d, function () { lstCustomers.append($(&#34;&lt;option&gt;&lt;/option&gt;&#34;).val(this[&#39;Value&#39;]).html(this[&#39;Text&#39;])); }); } function OnError(request, status, error) { alert(request.statusText); } }</pre> <p>plugin code:</p> <p>&nbsp;</p> <pre class="brush: html"> $(function () { $(&#39;[id*=ddlPlot]&#39;).multiselect({ includeSelectAllOption: true }); });</pre> <p>&nbsp;Please help me its urgent</p>https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/Thu, 08 Dec 2016 02:03:25 GMTPopulate ListBox using jQuery AJAX and apply Bootstrap MultiSelect plugin in ASP.Net<p>You need to reapply the multiselect plugin after binding the listbox.</p> <pre class="brush: js">function OnSuccess(r) { var lstCustomers = $(&#34;[id*=ddlPlot]&#34;); lstCustomers.empty(); $.each(r.d, function () { lstCustomers.append($(&#34;&lt;option&gt;&lt;/option&gt;&#34;).val(this[&#39;Value&#39;]).html(this[&#39;Text&#39;])); }); $(&#39;[id*=ddlPlot]&#39;).multiselect({ includeSelectAllOption: true }); }</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/Thu, 08 Dec 2016 02:30:53 GMTPopulate ListBox using jQuery AJAX and apply Bootstrap MultiSelect plugin in ASP.Net<p>no still its not working</p>https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/Thu, 08 Dec 2016 21:47:28 GMTPopulate ListBox using jQuery AJAX and apply Bootstrap MultiSelect plugin in ASP.Net<p>Hi <a class="username" rel="veenahosur"> veenahosur</a>,</p> <p>Refer the below sample.</p> <p><span style="text-decoration: underline;">HTML</span></p> <pre class="brush: html">&lt;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34;&gt; &lt;head runat=&#34;server&#34;&gt; &lt;title&gt;&lt;/title&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;link rel=&#34;stylesheet&#34; type=&#34;text/css&#34; href=&#34;http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css&#34; /&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js&#34;&gt;&lt;/script&gt; &lt;link rel=&#34;stylesheet&#34; type=&#34;text/css&#34; href=&#34;http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css&#34; /&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; $(function () { var district = &#39;&#39;, industry = &#39;&#39;, rsvr = &#39;&#39;; $.ajax({ type: &#34;POST&#34;, url: &#34;CS.aspx/GetPlotsbyReservation&#34;, data: &#34;{&#39;District&#39;:&#39;&#34; + district + &#34;&#39;,&#39;industry&#39;:&#39;&#34; + industry + &#34;&#39;,&#39;rsvr&#39;:&#39;&#34; + rsvr + &#34;&#39;}&#34;, contentType: &#34;application/json; charset=utf-8&#34;, dataType: &#34;json&#34;, success: function (r) { var lstindustrialareadetails = $(&#34;[id*=ddlPlot]&#34;); lstindustrialareadetails.empty(); $.each(r.d, function () { lstindustrialareadetails.append($(&#34;&lt;option&gt;&lt;/option&gt;&#34;).val(this[&#39;Value&#39;]).html(this[&#39;Text&#39;])); }); $(&#39;[id*=ddlPlot]&#39;).multiselect({ includeSelectAllOption: true }); } }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form id=&#34;form1&#34; runat=&#34;server&#34;&gt; &lt;asp:ListBox ID=&#34;ddlPlot&#34; runat=&#34;server&#34; SelectionMode=&#34;Multiple&#34;&gt;&lt;/asp:ListBox&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p><span style="text-decoration: underline;">Code</span></p> <pre class="brush: csharp">[WebMethod] public static List&lt;industrialareadetails&gt; GetPlotsbyReservation(string District, string industry, string rsvr) { string query = &#34;SELECT TOP 5 CustomerId,Name FROM Customers&#34;; string constr = ConfigurationManager.ConnectionStrings[&#34;constr&#34;].ConnectionString; using (SqlConnection con = new SqlConnection(constr)) { using (SqlCommand cmd = new SqlCommand(query)) { List&lt;industrialareadetails&gt; industrialareadetails = new List&lt;industrialareadetails&gt;(); cmd.CommandType = CommandType.Text; cmd.Connection = con; con.Open(); using (SqlDataReader sdr = cmd.ExecuteReader()) { while (sdr.Read()) { industrialareadetails.Add(new industrialareadetails { Value = sdr[&#34;CustomerId&#34;].ToString(), Text = sdr[&#34;Name&#34;].ToString() }); } } con.Close(); return industrialareadetails; } } } public class industrialareadetails { public string Value { get; set; } public string Text { get; set; } }</pre> <p><span style="text-decoration: underline;">Screenshot</span></p> <p><img src="https://i.imgur.com/2t2ZLLU.gif" alt="" width="300" height="221" /></p>https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/https://www.aspforums.net:443/Threads/324329/Populate-ListBox-using-jQuery-AJAX-and-apply-Bootstrap-MultiSelect-plugin-in-ASPNet/Fri, 09 Dec 2016 03:28:29 GMT