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.Collapse ListView Item on Mouse Hover using jQuery in ASP.Net<p>Hi <a class="username" rel="nauna"> nauna</a>,</p> <p>Refer below sample.</p> <p><span style="text-decoration: underline;"><strong>HTML</strong></span></p> <pre class="brush: html">&lt;script type=&#34;text/javascript&#34; src=&#34;http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js&#34;&gt;&lt;/script&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css&#34; /&gt; &lt;script type=&#34;text/javascript&#34;&gt; $(function () { $(&#39;[id*=lnk]&#39;).hover(function () { var id = $(this).next(&#39;div&#39;).find(&#39;[id*=HiddenField2]&#39;).val(); if ($(this).next(&#39;div&#39;).attr(&#39;class&#39;) == &#34;collapse in&#34;) { $(this).next(&#39;div&#39;).removeClass(&#39;collapse in&#39;); $(this).next(&#39;div&#39;).addClass(&#39;collapse out&#39;); } else { $(this).next(&#39;div&#39;).removeClass(&#39;collapse out&#39;); $(this).next(&#39;div&#39;).addClass(&#39;collapse in&#39;); } var oldURL = window.location.protocol + &#34;//&#34; + window.location.host + window.location.pathname; var newUrl = oldURL + &#34;?Id=&#34; + id; if (window.history != &#39;undefined&#39; &amp;&amp; window.history.pushState != &#39;undefined&#39;) { window.history.pushState({ path: newUrl }, &#39;&#39;, newUrl); } return false; }); }); &lt;/script&gt; &lt;div&gt; &lt;asp:ListView ID=&#34;lvCustomers&#34; runat=&#34;server&#34; GroupPlaceholderID=&#34;groupPlaceHolder1&#34; ItemPlaceholderID=&#34;itemPlaceHolder1&#34;&gt; &lt;ItemTemplate&gt; &lt;a class=&#34;btn btn-primary&#34; role=&#34;button&#34; id=&#34;lnk&#34; data-toggle=&#34;collapse&#34; href=&#34;#collapseExample&lt;%#Container.DataItemIndex%&gt;&#34; aria-expanded=&#34;false&#34; aria-controls=&#34;collapseExample&#34;&gt;CustomerId &lt;/a&gt; &lt;div class=&#34;collapse in&#34; id=&#34;#collapseExample&lt;%#Container.DataItemIndex%&gt;&#34;&gt; &lt;asp:Label ID=&#34;lblId&#34; runat=&#34;server&#34; Text=&#39;&lt;%# Eval(&#34;Name&#34;) %&gt;&#39;&gt;&lt;/asp:Label&gt; &lt;asp:HiddenField ID=&#34;HiddenField2&#34; runat=&#34;server&#34; Value=&#39;&lt;%# Eval(&#34;CustomerId&#34;) %&gt;&#39; /&gt; &lt;/div&gt; &lt;/ItemTemplate&gt; &lt;/asp:ListView&gt; &lt;/div&gt;</pre> <p><span style="text-decoration: underline;"><strong>Namespaces</strong></span></p> <p><strong>C#</strong></p> <pre class="brush: csharp">using System.Data.SqlClient; using System.Data; using System.Configuration;</pre> <p><strong>VB.Net</strong></p> <pre class="brush: vb">Imports System.Data.SqlClient Imports System.Data</pre> <p><span style="text-decoration: underline;"><strong>Code</strong></span></p> <p><strong>C#</strong></p> <pre class="brush: csharp">protected void Page_Load(object sender, EventArgs e) { if (!this.IsPostBack) { using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings[&#34;constr&#34;].ConnectionString)) { using (SqlCommand cmd = new SqlCommand(&#34;SELECT CustomerId,Name FROM Customers&#34;, con)) { using (SqlDataAdapter da = new SqlDataAdapter(cmd)) { DataTable dt = new DataTable(); da.Fill(dt); lvCustomers.DataSource = dt; lvCustomers.DataBind(); } } } } }</pre> <p><strong>VB.Net</strong></p> <pre class="brush: vb">Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load If Not Me.IsPostBack Then Using con As SqlConnection = New SqlConnection(ConfigurationManager.ConnectionStrings(&#34;constr&#34;).ConnectionString) Using cmd As SqlCommand = New SqlCommand(&#34;SELECT CustomerId,Name FROM Customers&#34;, con) Using da As SqlDataAdapter = New SqlDataAdapter(cmd) Dim dt As DataTable = New DataTable() da.Fill(dt) lvCustomers.DataSource = dt lvCustomers.DataBind() End Using End Using End Using End If End Sub</pre> <p><span style="text-decoration: underline;"><strong>Screenshot</strong></span></p> <p><img src="https://i.imgur.com/1osyLx8.gif" alt="" width="347" height="304" /></p>https://www.aspforums.net:443/Threads/158471/Collapse-ListView-Item-on-Mouse-Hover-using-jQuery-in-ASPNet/https://www.aspforums.net:443/Threads/158471/Collapse-ListView-Item-on-Mouse-Hover-using-jQuery-in-ASPNet/Wed, 10 Jul 2019 03:45:44 GMT