Div Hide and show when i click button in Repeater

Posted by Jenniffer under ASP.NET on 5/15/2013 | Points: 10 | Views : 3002 | Status : [Member] | Replies : 2
Hi..
Somebody please help me do this concept.... I'm having repeater with a button... If i click the button the div content should display......
This is my repeater....

<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<div class="propSearchMainContentBg" style="width:100%;">
<table style="width:100%;">
<tr>
<td>
<div style="color:#1260cd;font-weight:bold; padding:5px; background:#e3e3e3;border-bottom:2px solid #b2b2b2;">
<asp:CheckBox ID="CheckBox4" runat="server" />
<asp:Label ID="Label6" runat="server" Text="Residential Plot for sale" Width="500px"></asp:Label>
</div>
</td>
</tr>
</table>
<table class="propSearchMainContent" style="width:100%;">
<tr><td>
Total Price : <asp:Label ID="Label7" runat="server" Text='<%#Eval("TotalPrice") %> ' style="color:#c3262d; font-weight:bold;"></asp:Label>
</td></tr>
<tr><td>
Per Unit Price : <asp:Label ID="Label14" runat="server" Text='<%#Eval("PerUnitPrice") %> '></asp:Label>
</td></tr>
<tr><td>
Age of Construction : <asp:Label ID="Label16" runat="server" Text='<%#Eval("AgeofConstruction") %> '></asp:Label>
</td></tr>
<tr><td>
Description : <asp:Label ID="Label17" runat="server" Text='<%#Eval("BriefDescription") %> '></asp:Label>
</td></tr>
<tr><td>
<asp:Button ID="Btn_Contact " runat="server" Text="Contact Owner" style="color:#fff; font-weight:bold; background-color:#8d00f0;"/>
<asp:Button ID="Btn_SE" runat="server" Text="Get Contact Details on SMS/Email" style="font-weight:bold;border:1px solid #b2b2b2;"/>
</td>
</tr>
</table>
<div id="Contact " runat="server" visible="false">
hghghgghghhhhhhh
</div>
<div id="Sms " runat="server" visible="false">
hghghgghghhhhhhh
</div>
</div>
<br></br></div>
</ItemTemplate>
</asp:Repeater>
when i click the button - Btn_Contact the div - Contact should display
If i click the button - Btn_SE the div - Sms should display.

Thanks & Regards
JENI



Responses

Posted by: aswinialuri-19361 on: 5/15/2013 [Member] Starter | Points: 25

Up
0
Down
Hi Jenni,

Using jquery you can hide and show
why we are using jquery means it reduce our code burden also
using function we can access the data
i will show how it is easy
<script>
$(document).ready(function(){
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<p>If you click on the "Hide" ASWINI, I will disappear.</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
</body>
i Hope it will help you
Mark as answer if it helps you
Thanks& Regards

Mark as Answer if it helps you
Thanks&Regards
Aswini Aluri

Jenniffer, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Jenniffer on: 5/16/2013 [Member] Starter | Points: 25

Up
0
Down
I know this already what u have said.... I'm trying this concept inside the repeater..... If u know please help me to do this.....

Thanks & Regards
JENI

Jenniffer, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response