Databases
StackOverflow2013
Postsdbo
POHow to hide(or show) a part of the data bound to a repeater using jQuery
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to hide(or show) a part of the data bound to a repeater using jQuery
    primarykey
    data
    text
    <p>Suppose that we have some products and their details in our database. I want products names to appear on the page without their details. And if the user hovers on one of the products, the detail for that specific product slides down. I am using using a repeater to retrieve and show the products' data from the database.</p> <p>Here's my code:</p> <pre><code> //this is the html &lt;div&gt; &lt;asp:Repeater ID="myRepeater" runat="server"&gt; &lt;ItemTemplate&gt; &lt;div class="productTiltle"&gt; &lt;%#Eval("producttitle") %&gt; &lt;br /&gt; &lt;/div&gt; &lt;div class="productDetail"&gt; &lt;%#Eval("productdetail") %&gt; &lt;/div&gt; &lt;/ItemTemplate&gt; &lt;SeparatorTemplate&gt; &lt;hr /&gt; &lt;/SeparatorTemplate&gt; &lt;/asp:Repeater&gt; //this is the css .productTitle { background-color:#f00; font-size:x-large; text-align:center; } .productDetail { background-color:#ff6a00; font-size:large; } //this is the JQuery $(document).ready(function () { $(".productDetail").hide(); $(".productTiltle").hover(function () { $(".productDetail").slideDown('normal'); }, function () { $(".productDetail").slideUp('normal'); }); }); </code></pre> <p>I need the repeater to style every row of product I retrieve from the database. But the problem is (as expected), when I use jQuery to do something to the <code>.productDetail</code> class, every single element with that class will be affected (in this case, all of the page). But I need some way to use jQuery to do something to a specific product.</p> <p>e.g if we have products 1 to 100,with <code>productTitles</code> of product1,product2,...,product100;and a user hovers on product23,only product23's details show up</p> <p>How can I achieve this?</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USmarc_s
    1. USroostaamir
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. CODude, do you really need jQuery for this? CSS will do it just easy, and the overhead for the browser will be minimum.
      singulars
      1. POHow to hide(or show) a part of the data bound to a repeater using jQuery
      1. USAdrian Salazar
    2. CO@Adrian Salazar Since they are two separate elements,I can't use css.I could put them in a `div` and then select it using the `div` 's hover state.but that is not what I want.But if you have better idea,I'd be more than happy to know it
      singulars
      1. POHow to hide(or show) a part of the data bound to a repeater using jQuery
      1. USroostaamir
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload