How to use panel.

[Krishna Chaudhary]

Hi

i am facing issue in implementing the Radpanel. I want below things on my page
Put all the search criteria including the “Search button into a “RadPanel”.  Make sure the RadPanel is minimized the first time the page loads.  If they change the search criteria and click “Search”, when the page reloads, then display the RadPanel as maximized.
See below code and screenshort.
i want my first div in 1 panel.

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Common/MMMasterPage.Master" CodeBehind="MMTaskNotesHistory.aspx.vb" Inherits="CSC.CorporateAdvisor.Web.MMTaskNotesHistory1" %>
<%@ MasterType VirtualPath="~/Common/MMMasterPage.Master" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
<asp:Content ID="Content1" ContentPlaceHolderID="extJSPlaceholder" runat="server">
<script src="../InvoiceApproval.js" type="text/javascript"></script>
<script type="text/javascript" >
    function Valueofpriority1(item) {
       var combo = $find("<%= ddlPriorty.ClientID %>");
       var getvalue = item.get_value();
       document.all.<%= ddlprio.ClientID %>.value =getvalue;
    }
function OnClientSelectedIndexChanged1(item) {
      var Getvaluecat = item.get_value();
      document.all.<%=valueddlCategory.ClientID%>.value = Getvaluecat;
    }
function handleViewNoteClicknew()
{
    var location = "../RespondToTaskNotes.aspx";
    var results = window.showModalDialog(
                location,
                null,
                "dialogWidth:700px; "
                + " dialogHeight:580px; "
                + " edge: Raised; "
                + " center: Yes; "
                + " help: No; "
                + " resizable: Yes; "
                + " scroll: No; "
                + " status: No;"
                );
}
function handleEmailNoteClicknew() {
    var location = "./MMEmailForTaskAndNotes.aspx";
    var results = window.showModalDialog(
                location,
                null,
                "dialogWidth:700px; "
                + " dialogHeight:580px; "
                + " edge: Raised; "
                + " center: Yes; "
                + " help: No; "
                + " resizable: Yes; "
                + " scroll: No; "
                + " status: No;"
                );
}
function showNoteandTask() {
    var oWnd = $find("<%= RadWindow2.ClientID %>");
    oWnd.show();
    oWnd.setSize(750,600);
    oWnd.add_close(OnClientClose);
}
function OnClientClose(oWnd, eventArgs) {

    oWnd.remove_close(OnClientClose);
}
//Function for the Radcontext menu
function RowContextMenu(sender, eventArgs) {
    var menu = $find("<%= RadMenu1.ClientID %>");
    var evt = eventArgs.get_domEvent();

    if (evt.target.tagName == "INPUT" || evt.target.tagName == "A") {
        return;
    }

    var index = eventArgs.get_itemIndexHierarchical();
    document.getElementById("radGridClickedRowIndex").value = index;

    sender.get_masterTableView().selectItem(sender.get_masterTableView().get_dataItems()[index].get_element(), true);

    menu.show(evt);

    evt.cancelBubble = true;
    evt.returnValue = false;

    if (evt.stopPropagation) {
        evt.stopPropagation();
        evt.preventDefault();
    }
}
//Function Ends

</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="pageDataPlaceHolder" runat="server">
<div class="tabBottom">
<Windows>
<telerik:RadWindow ID="RadWindow2" Title="Add Task/Notes"  Modal="true" Behavior="Close,Move" Mode="Modal" NavigateUrl="MMTaskNotes.aspx"
                 runat="server" ReloadOnShow="true">
  </telerik:RadWindow>
  </Windows>
<telerik:RadPanelBar  ID="RadPanelBar1"  runat="server"  Skin="Telerik" >
<Items >
 <telerik:RadPanelItem       Text="Your Data"       runat="server">
     <ItemTemplate>
   </ItemTemplate>
   </telerik:RadPanelItem>
   </Items>
   <ItemTemplate >
   <div>
    <table>
     <tr>
      <td>Priorty</td>
      <td>
          <input id="ddlprio" type="hidden" runat="server"/>
          <telerik:RadComboBox ID="ddlPriorty" Runat="server" OnClientSelectedIndexChanged="Valueofpriority1">
          </telerik:RadComboBox>
      </td>
      <td>
         <asp:CheckBox ID="chkAssignedNote" runat="server" Text="My Assigned Notes/Tasks:" />
      </td>
    </tr>
    <tr>
        <td>Category:</td>
        <td>
            <input id="valueddlCategory" type="hidden" runat="server" />
            <telerik:RadComboBox ID="ddlCategory" Runat="server" Width="200" OnClientSelectedIndexChanged="OnClientSelectedIndexChanged1">
            </telerik:RadComboBox>
        </td>
        <td>
           <asp:CheckBox ID="chkPrivate" runat="server" Text="Private"/>
        </td>
        <td>
          <asp:Button ID="btnSearch" Text="Search" runat="server" />
        </td>
     </tr>
    </table>
   </div>
   </ItemTemplate>
 </telerik:RadPanelBar>

 <div>
          <%--<telerik:RadGrid ID="MatterHistorydatagrid" runat="server" GridLines="None" CssClass="RadGrid"
                ShowGroupPanel="True"
                AutoGenerateColumns="False" ShowStatusBar="True" Height="350px" Width="99%">--%>
            <asp:HiddenField ID="hidProcessingFees" runat="server" value=""/>
            <telerik:RadGrid ID="MMtaskNoteHistoryDataGrid" runat="server" CssClass="RadGrid" GridLines="None"
                    AllowPaging="true" AllowSorting="true" AutoGenerateColumns="False" enablePaging="True"
                    ShowStatusBar="true" HorizontalAlign="NotSet" Height="350px" Width="99%">
                     <PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
                <MasterTableView ShowHeadersWhenNoRecords="false" GridLines="None" PageSize="15">
                        <Columns>
                            <%--<telerik:GridTemplateColumn UniqueName="select">
                                <ItemTemplate>
                                    <asp:RadioButton ID="rdSelect" runat="server" AutoPostBack="True" />
                                </ItemTemplate>
                                <HeaderTemplate>
                                    Select
                                </HeaderTemplate>
                                <HeaderStyle Width="5%"></HeaderStyle>
                              </telerik:GridTemplateColumn>--%>
                            <telerik:GridBoundColumn UniqueName="CREATED_DTM" HeaderText="Created Date" DataField="CREATED_DTM" DataFormatString="{0:d}">
                                    <HeaderStyle Width="10%"></HeaderStyle>
                                </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="AUTHOR_NAME" HeaderText="Author" DataField="AUTHOR_NAME" DataFormatString="{0:C}">
                                <HeaderStyle Width="20%"></HeaderStyle>
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="SUPPORT_DATA_NAME" HeaderText="Type" DataField="SUPPORT_DATA_NAME" DataFormatString="{0:C}">
                                <HeaderStyle Width="10%"></HeaderStyle>
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="START_DATE" HeaderText="Start Date" DataField="START_DATE" DataFormatString="{0:d}">
                                    <HeaderStyle Width="10%"></HeaderStyle>
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="DUE_DATE" HeaderText="Due Date" DataField="DUE_DATE" DataFormatString="{0:d}">
                                    <HeaderStyle Width="10%"></HeaderStyle>
                                </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn UniqueName="Text" HeaderText="Text" DataField="Text" DataFormatString="{0:P}">
                                <HeaderStyle Width="40%"></HeaderStyle>
                            </telerik:GridBoundColumn>
                       </Columns>
                    </MasterTableView>
                    <ClientSettings>
                            <ClientEvents OnRowContextMenu="RowContextMenu"></ClientEvents>
                            <Selecting AllowRowSelect="true" />
                            <Scrolling AllowScroll="true" UseStaticHeaders="true" />
                     </ClientSettings>
                </telerik:RadGrid>
                <input type="hidden" id="radGridClickedRowIndex" name="radGridClickedRowIndex" />
                <telerik:RadContextMenu ID="RadMenu1" runat="server"  OnItemClick="RadMenu1_ItemClick" EnableRoundedCorners="true" EnableShadows="true">
                    <Items>
                        <telerik:RadMenuItem Text="Respond" />
                        <telerik:RadMenuItem Text="Email" />
                        <telerik:RadMenuItem Text="Print" />
                        <telerik:RadMenuItem Text="View" />
                    </Items>
                </telerik:RadContextMenu>
  </div>
 <div>
      <%--<table>
            <asp:Button ID="btnRespond" runat="server" Text="Respond" Width="125px" OnClientClick="handleViewNoteClicknew()"/>
            <asp:Button ID="btnEmail" runat="server" Text="Email" Width="94px" OnClientClick="handleEmailNoteClicknew()"/>
            <asp:Button  ID="btnprint" runat="server" Text="Print" Width="90px" />
            <asp:Button ID="btnView" runat="server" Text="View" Width="89px" />
            <asp:Button ID="btnclose" runat="server" Text="Close" style="margin-left: 0px"
                    Width="81px" />
       </table>--%>

</div>
</div>
</asp:Content>

[Yana]

Hello Krishna,

I suggest you use the new ContentTemplate of panelbar  (available since Q2 2010 release), you can reference the controls in it directly with their ID (no need to use FindControl method):

<telerik:RadPanelBar ID="RadPanelBar1" runat="server" Width="410px">
          <Items>
              <telerik:RadPanelItem Text="click to search">
                  <ContentTemplate>
                      <div>
                          <table>
                              <tr>
                                  <td>
                                      Priorty
                                  </td>
                                  <td>
                                      <input id="ddlprio" type="hidden" runat="server" />
                                      <telerik:RadComboBox ID="ddlPriorty" runat="server" >
                                      </telerik:RadComboBox>
                                  </td>
                                  <td>
                                      <asp:CheckBox ID="chkAssignedNote" runat="server" Text="My Assigned Notes/Tasks:" />
                                  </td>
                              </tr>
                              <tr>
                                  <td>
                                      Category:
                                  </td>
                                  <td>
                                      <input id="valueddlCategory" type="hidden" runat="server" />
                                      <telerik:RadComboBox ID="ddlCategory" runat="server" Width="200">
                                      </telerik:RadComboBox>
                                  </td>
                                  <td>
                                      <asp:CheckBox ID="chkPrivate" runat="server" Text="Private" />
                                  </td>
                                  <td>
                                      <asp:Button ID="btnSearch" Text="Search" runat="server" OnClick="Search_Click" />
                                  </td>
                              </tr>
                          </table>
                      </div>
                  </ContentTemplate>
              </telerik:RadPanelItem>
          </Items>
      </telerik:RadPanelBar>

Best regards,
Yana
the Telerik team