Ajax and Jquery issue : The Official Microsoft ASP.NET Forums

Reply

Ajax and Jquery issue

Nov 08, 2010 12:40 PM|LINK

hi all,

i am using 3 hyperlinks

1. html hyperlink: Add

2.<asp:linkbutton>:Edit

3.<asp:linkbutton>:Delete

for the Add,Edit,Delete hyperlinks i want to show the end user a toggle panel (something like: Collapsable panel),

what i did is,

for the first hyperlink I used jquery and when i am using ajax to the next edit linkbutton, the previous jquery is not working untill unless i clicked once on edit button.

my code is as below

<script language="javascript" type="text/javascript">
            $(document).ready(function() {
                   $("#CommonAdd").click(function() {
            $("#jShow").toggle("slow");
            })
            })
        </script>


<a href="#" id="CommonAdd">Add</a>
<asp:LinkButton ID="lnkbtnEdit" runat="server" Text="Edit" OnClick="lnkbtnEdit_Click" ></asp:LinkButton>
<asp:LinkButton ID="lnkbtnDelete" runat="server" Text="Delete"></asp:LinkButton>


<div id="jShow"  style="display:none;">
<asp:Panel ID="pnlAddEdit" runat="server">
 <table  width="100%"  border="0" cellpadding="2" cellspacing="1" bgcolor="#F0AD6A" class="mt">
<tr>
<td width="20%" align="left" bgcolor="#FAE2CB">Unit Code:</td>
<td width="20%" align="left" bgcolor="#FFFFFF"><input name="textfield2" type="text" class="mtt2" size="18">
</td>
<td width="20%" align="left" bgcolor="#FAE2CB">Unit Description:</td>
<td align="left" bgcolor="#FFFFFF"><input name="textfield22" type="text" class="mtt2" size="18"></td>
<td align="center" bgcolor="#FFFFFF"><img src="images/add.gif" width="62" height="22"></td>
                </tr>
                </table>
                

                </asp:Panel>
<cc1:CollapsiblePanelExtender runat="server" ID="CollapsiblePanelExtender8"
               TargetControlID="pnlAddEdit"
               CollapsedSize="0"
               Collapsed="True"
               ExpandControlID="lnkbtnEdit" CollapseControlID="lnkbtnEdit"
               SuppressPostBack="true">
              </cc1:CollapsiblePanelExtender>

Please help me how to fire those two separately and neatly

here,

when i removed the ajax collapsable control the add panel is diplaying fine

but when i am inserting ajax the former is not working unless first i clicked the edit button.

Reply

Re: Ajax and Jquery issue

Nov 08, 2010 03:35 PM|LINK

not sure what you are trying to do. you have an CollapsiblePanel which only displays if you click the edit button. you place this panel in a hidden div that only displays if you click add. so to see the data you need to click both edit and add. makes no sense.

bruce (sqlwork.com)

Reply

kiranbvsn

Member

6 Points

44 Posts

Re: Ajax and Jquery issue

Nov 09, 2010 03:44 AM|LINK

this is where i am getting confused,

i want to add a new item or edit the existing item in the same panel( which is hidden)

if i've used link buttons, i will disable edit and delete buttons when user clicks the add button and same thing with edit,

so how i am supposed to do that

Reply

raghav_khung...

All-Star

32835 Points

5563 Posts

MVP

Re: Ajax and Jquery issue

Nov 09, 2010 06:00 AM|LINK

Hi Kiran,

I am not able to understand your exact requirement. Please explain clearly.

Raghav|My Articles|My Blog

Reply

Anirudh.Gupt...

Member

633 Points

171 Posts

Re: Ajax and Jquery issue

Nov 09, 2010 07:19 AM|LINK

can you change your script code to this and see if this works ?

<script > Sys.Application.add_load(addClickEvent);


function addClickEvent()
{
$("#CommonAdd").click(function() {
            $("#jShow").toggle("slow");
            }) ;


}
</script>

http://www.kbdump.com/