Ajax UpdatePanel无法正常工作？

Question

I am very new to Ajax and have been impressed with reading about it and how you can refresh a area of a page and not the whole thing. I thought doing this when reading about it was fairly easy but I'm abit stuck on an area.

I have a Report-viewer on my page which uses a ScriptManager and I have a calendar control which when I click a day will need to refresh to put that into a Textbox.

The Report-viewer is on the page when it loads it needs to be passed a parameter but can only get that after they have selected something from a combobox

So this is what I have done so far:

<li>
    <asp:UpdatePanel runat="server" ID="updateDOI">
        <ContentTemplate>

             <input id="txt_DateOfInterview" type="Date" class="aclass" runat="server" />

                  <asp:ImageButton runat="server" ImageUrl="~/Images/Calender.png" ID="calendericonDOI" CssClass="calendericonDOI ClanderDOI" OnClick="calendericonDOI_Click"></asp:ImageButton>

                  <asp:Calendar runat="server" ID="ClanderDOI" CssClass="ClanderDOI" OnSelectionChanged="ClanderDOI_SelectionChanged" BorderColor="#6a3d98" OnVisibleMonthChanged="ClanderDOI_VisibleMonthChanged">
                       <TitleStyle BackColor="Orange" />
                  </asp:Calendar>

        </ContentTemplate>
     </asp:UpdatePanel>

As you can see i have a wrapped a UpdatePanel around the calender and also the input box that will get populated with the day selected

And then with the report viewer I have done the same:

<asp:UpdatePanel runat="server" ID="UpdatePanel1">
      <ContentTemplate>
           <rsweb:ReportViewer ID="rvSickness" runat="server" BackColor="#6e4594" Font-Names="Arial" Font-Size="8pt" Height="100%" ProcessingMode="Remote" WaitMessageFont-Names="Arial" WaitMessageFont-Size="14pt" Width="450px" ShowCredentialPrompts="False" ShowParameterPrompts="False" ShowPromptAreaButton="True" ShowToolBar="true" ShowFindControls="False" ToolBarItemBorderColor="#FF9900" ToolBarItemHoverBackColor="#FF9900" ForeColor="White">
                   <ServerReport ReportServerUrl="" />
                                </rsweb:ReportViewer>
      </ContentTemplate>
 </asp:UpdatePanel>

But what I don't understand it that the ReportViewer is still refreshing when I do anything.

My question is why is the Report-viewer refreshing when I am selecting something from a calender control? Is it because it has not been passed a parameter yet or have I done something wrong?

Answer 1

what you can do is take two update panels

In first UpdatePanel in which i took a DropDownList(here i took some sample dropdown list items)

<asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional">
        <ContentTemplate>
            <asp:DropDownList ID="DropDownList1" ClientIDMode="AutoID" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                <asp:ListItem>one</asp:ListItem>
                <asp:ListItem>two</asp:ListItem>
                <asp:ListItem>three</asp:ListItem>
                <asp:ListItem>four</asp:ListItem>
            </asp:DropDownList>
        </ContentTemplate>
    </asp:UpdatePanel>

Second update panel in which i took your ReportViewer

<asp:UpdatePanel runat="server" ID="UpdatePanel2" UpdateMode="Conditional">
    <ContentTemplate>
        <rsweb:ReportViewer ID="rvSickness" runat="server" BackColor="#6e4594" Font-Names="Arial" Font-Size="8pt" Height="100%" ProcessingMode="Remote" WaitMessageFont-Names="Arial" WaitMessageFont-Size="14pt" Width="450px" ShowCredentialPrompts="False" ShowParameterPrompts="False" ShowPromptAreaButton="True" ShowToolBar="true" ShowFindControls="False" ToolBarItemBorderColor="#FF9900" ToolBarItemHoverBackColor="#FF9900" ForeColor="White">
         <ServerReport ReportServerUrl="" />
        </rsweb:ReportViewer>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
    </Triggers>
</asp:UpdatePanel>

Now in code behind you can pass the id to your ReportViewer on DropDownList1_SelectedIndexChanged event like this

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
        {
            //your code here
        }

Note: I didn't took you calendar and other controls in this answer as you wanted to update the ReportViewer only when you select an item from DropDownList