Jquery with ajax controls

Question

Below is the offending piece of java script code(1). I am using an ajax update panel with a ajax calender control and an asp button(2). We are using the javascript to simulate a button click. Which is in conflict with the calender control and the update panel. The error is (3)

    function tsSave() {
        $("#<%=btnSave.ClientID%>").click();
    }

 <ajax:CalendarExtender ID="calRemovalDate" runat="server"  PopupButtonID="img1" PopupPosition="Right" TargetControlID="txtRemovalDate">
                                </ajax:CalendarExtender>

(3)

The Controls collection cannot be modified because the control contains code blocks

I understand that there are better ways of doing this, but this is the method we required to use. If there is a way using jquery without using the '=' to still grab the clientID of the submit button that would probably fix the problem, as always thank you for your help

Answer 1

Move the

function tsSave() { 
        $("#<%=btnSave.ClientID%>").click(); 
    }

outside of the update panel. If it can't be moved for some reason, put a snippet of JS outside the panel that has <%=btnSave.ClientID%> set in it and call that from your JS in the update panel.

Answer 2

The final solution was just not to use jquery with this particle issue.