jquery is not working on panel hide on post back

Question

I have created SharePoint application page and I have a Dropdownlist (ddlTaskFrequency). On dropdown text changed(Monthly) I have written a jQuery code to show panel2 and hide panel1. it is working fine when the form is saved .

When I click on Edit item it is loading Panel 1 where it has to load panel 2. So the Panel1 which I am hiding through jQuery is not working after post back. How to achieve this.

Any help please.

<asp:Panel ID="Panel1" runat="server">
                    <font face="Arial" class="TextSize">The Due Date Of this Task will be </font>
                    <asp:TextBox ID="txtNoofDays" runat="server" Width="28px"></asp:TextBox>
                    &nbsp;<font face="Arial" class="TextSize">Day(s) Following the Task&nbsp;Start Date<br />
                        <br />
                        <font color="#c00000">The Calculated Due Date is:</font>
                        <asp:TextBox ID="Txtdailyweekly" runat="server" Style="margin-top: 8px" Height="18px"
                            Width="101px" BackColor="#F1F0EF" BorderStyle="None"></asp:TextBox>
                    </font>
                </asp:Panel>


                <asp:Panel ID="Panel2" runat="server">
                    <font face="Arial" class="TextSize">Happens Every </font>
                    <asp:DropDownList ID="ddlMonthDay" runat="server" Height="21px" Width="45px">
                        <asp:ListItem Selected="True" Text="1st" Value="1"></asp:ListItem>
                        <asp:ListItem Text="2nd" Value="2"></asp:ListItem>
                        <asp:ListItem Text="3rd" Value="3"></asp:ListItem>
                        <asp:ListItem Text="4th" Value="4"></asp:ListItem>
                    </asp:DropDownList>
                    &nbsp;<asp:DropDownList ID="ddlMonthWeekDay" runat="server" Height="21px" Width="115px">
                        <asp:ListItem Selected="True" Text="Sunday" Value="0"></asp:ListItem>
                        <asp:ListItem Text="Monday" Value="1"></asp:ListItem>
                        <asp:ListItem Text="Tuesday" Value="2"></asp:ListItem>
                        <asp:ListItem Text="Wednesday" Value="3"></asp:ListItem>
                        <asp:ListItem Text="Thursday" Value="4"></asp:ListItem>
                        <asp:ListItem Text="Friday" Value="5"></asp:ListItem>
                        <asp:ListItem Text="Saturday" Value="6"></asp:ListItem>
                    </asp:DropDownList>
                    <font face="Arial" class="TextSize">&nbsp;of the Month
                        <br />
                        <br />
                        <font color="#c00000">The Calculated Due Date is:&nbsp; </font>
                        <asp:TextBox ID="txtMonthDueDate" runat="server" Height="18px" Width="101px" BackColor="#F1F0EF"
                            BorderStyle="None"></asp:TextBox>
                    </font>
                </asp:Panel>
 pageload(){ 
$(document).ready(function () {


 $('#' + '<%=this.Panel2.ClientID  %>').hide();
                Dailyweekly();

                $('#' + '<%=this.ChkNoofDays.ClientID  %>').change(function () {
                    ddltaskfreqselcted = $('#' + '<%=this.ddlTaskFrequency.ClientID  %> option:selected').text();
                    if (ddltaskfreqselcted == "Daily" && this.checked) {
                        $('#' + '<%=this.Panel1.ClientID  %>').hide();
                        $('#' + '<%=this.Panel2.ClientID  %>').hide();


                    }
                    else {

                        $('#' + '<%=this.Txtdailyweekly.ClientID  %>').val('');
                        $('#' + '<%=this.txtNoofDays.ClientID  %>').val('');
                        $('#' + '<%=this.Panel1.ClientID  %>').show();
                        $('#' + '<%=this.Panel2.ClientID  %>').hide();
                    }


                });
$('#' + '<%=this.ddlTaskFrequency.ClientID  %>').change(function taskfreqchanged() {


                    $('#' + '<%=this.ddlMonthDay.ClientID %>').val('1');
                    $('#' + '<%=this.ddlMonthWeekDay.ClientID %>').val('0');

                    ddltaskfreqselcted = $('#' + '<%=this.ddlTaskFrequency.ClientID  %> option:selected').text();
                    // alert(ddltaskfreqselcted);
                    if (ddltaskfreqselcted == "Daily") {
                        $('#' + '<%=this.Txtdailyweekly.ClientID  %>').val('');
                        $('#' + '<%=this.txtNoofDays.ClientID  %>').val('');

                        $('#' + '<%=this.Panel1.ClientID  %>').show();
                        $('#' + '<%=this.Panel2.ClientID  %>').hide();

                        var Dropdownvalues = $('#' + '<%=this.ddlDayofMonth.ClientID%>').empty();
                        Dailyweekly();

                        $('#' + '<%=this.ChkNoofDays.ClientID  %>').change(function () {
                            if (ddltaskfreqselcted == "Daily" && this.checked) {
                                $('#' + '<%=this.Panel1.ClientID  %>').hide();
                                $('#' + '<%=this.Panel2.ClientID  %>').hide();


                            }
                            else {
                                $('#' + '<%=this.Txtdailyweekly.ClientID  %>').val('');
                                $('#' + '<%=this.txtNoofDays.ClientID  %>').val('');

                                $('#' + '<%=this.Panel1.ClientID  %>').show();
                                $('#' + '<%=this.Panel2.ClientID  %>').hide();
                            }
                            $('#' + '<%=this.ChkNoofDays.ClientID  %>').val('');
                        });

                    }
                    if (ddltaskfreqselcted == "Weekly") {

                        $('#' + '<%=this.Txtdailyweekly.ClientID  %>').val('');
                        $('#' + '<%=this.txtNoofDays.ClientID  %>').val('');

                        $('#' + '<%=this.Panel1.ClientID  %>').show();
                        $('#' + '<%=this.Panel2.ClientID  %>').hide();

                        var Dropdownvalues = $('#' + '<%=this.ddlDayofMonth.ClientID%>').empty();
                        Dailyweekly();

                        $('#' + '<%=this.ChkNoofDays.ClientID  %>').change(function () {

                            if (ddltaskfreqselcted == "Weekly" && this.checked) {
                                $('#' + '<%=this.Panel1.ClientID  %>').hide();
                                $('#' + '<%=this.Panel2.ClientID  %>').hide();


                            }
                            else {
                                $('#' + '<%=this.Txtdailyweekly.ClientID  %>').val('');
                                $('#' + '<%=this.txtNoofDays.ClientID  %>').val('');


                                $('#' + '<%=this.Panel1.ClientID  %>').show();
                                $('#' + '<%=this.Panel2.ClientID  %>').hide();
                            }
                            $('#' + '<%=this.ChkNoofDays.ClientID  %>').val('');
                        });

                    }

                    if (ddltaskfreqselcted == "Monthly") {
                        $('#' + '<%=this.Txtdailyweekly.ClientID  %>').val('');
                        $('#' + '<%=this.txtNoofDays.ClientID  %>').val('');

                        $('#' + '<%=this.Panel1.ClientID  %>').hide();
                        $('#' + '<%=this.Panel2.ClientID  %>').show();

                        var Dropdownvalues = $('#' + '<%=this.ddlDayofMonth.ClientID%>').empty();
                        monthly();

                        $('#' + '<%=this.ChkNoofDays.ClientID  %>').change(function () {

                            if (ddltaskfreqselcted == "Monthly" && this.checked) {
                                $('#' + '<%=this.Panel1.ClientID  %>').hide();
                                $('#' + '<%=this.Panel2.ClientID  %>').hide();
                                $('#' + '<%=this.txtMonthDueDate.ClientID %>').val('');
                            }

                            else {

                                $('#' + '<%=this.Panel1.ClientID  %>').hide();
                                $('#' + '<%=this.Panel2.ClientID  %>').show();
                            }
                            $('#' + '<%=this.ChkNoofDays.ClientID  %>').val('');
                        });
                    }
                    $('#' + '<%=this.lblNameChange.ClientID  %>').text($('#' + '<%=this.ddlTaskFrequency.ClientID  %>').val());
                }); //dropdownchanged
}); 
}

Answer 1

Hi I have achieved this by including the below validation on the dropdown value changed.

if (ddltaskfreqselcted != "Monthly") {

                $('#' + '<%=this.Panel2.ClientID  %>').hide();
                Dailyweekly();

            }
            else {
                $('#' + '<%=this.Panel1.ClientID  %>').hide();
                monthly();

            }