In RadGrid Nest a RadChart

Thread is closed for posting
7 posts, 0 answers
  1. yang
    yang avatar
    47 posts
    Member since:
    Oct 2010

    Posted 21 Mar 2012 Link to this post

    Hi Telerik:

    This is a question perplex me.
    In RadGrid,Nest a RadChart,Of course ,that data bind to radGrid.
    There are two kind of think. 
            First : Through data of  radGrid takes datasource to radChart. This think source think of silverlight.
            Second: Through keyColumn of  radGrid ,Execute StoredProcedure with parameter to bind radChart. Why needing execute StoredProcedure ,Because I must process some things. The SqlDataSource seem to can't to execute  StoredProcedure with parameter.

    I try to two ways,but fail.I  distressed.
    So I please admin help me trying to use second way. Give me some example.
    The sourcecode here:


    <telerik:RadGrid AutoGenerateColumns="False" ID="RadGridFHData"
                    AllowFilteringByColumn="True" AllowPaging="True"
                    AllowSorting="True" runat="server" ShowGroupPanel="true"
                onitemcommand="RadGridFHData_ItemCommand">
                    <PagerStyle Mode="NextPrevAndNumeric" />
                    <GroupingSettings CaseSensitive="false" />
                    <MasterTableView TableLayout="Fixed" DataKeyNames="FHID" ClientDataKeyNames="FHID">
                        <Columns>
                            <telerik:GridBoundColumn HeaderText="FHID" DataField="FHID" UniqueName="FHID"
                                SortExpression="FHID" HeaderStyle-Width="100px" FilterControlWidth="100px"
                                AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" />

                            <telerik:GridBoundColumn HeaderText="病人ID" DataField="PID" UniqueName="PID"
                                SortExpression="PID" HeaderStyle-Width="100px" FilterControlWidth="100px"
                                AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" />

                            <telerik:GridBoundColumn HeaderText="病人姓名" DataField="PName" UniqueName="PName"
                                SortExpression="PName" HeaderStyle-Width="100px" FilterControlWidth="100px"
                                AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" />

                            <telerik:GridNumericColumn  HeaderText="测量值" DataField="FHValue" UniqueName="FHValue"
                                SortExpression="FHValue" HeaderStyle-Width="100px" FilterControlWidth="140px"
                                AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" />

                            <telerik:GridDateTimeColumn HeaderText="测量日期" DataField="ReceiveDate" UniqueName="ReceiveDate"
                                SortExpression="ReceiveDate" HeaderStyle-Width="100px" FilterControlWidth="140px"
                                AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" />

                            <telerik:GridBoundColumn HeaderText="查看状态" DataField="isNew" UniqueName="isNew"
                                SortExpression="isNew" HeaderStyle-Width="100px" FilterControlWidth="140px"
                                AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" />

                            <telerik:GridBoundColumn HeaderText="医生留言" DataField="Remark" UniqueName="Remark"
                                SortExpression="Remark" HeaderStyle-Width="100px" FilterControlWidth="140px"
                                AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" />
                        </Columns>
                                            
                        <NestedViewSettings>
                            <ParentTableRelation>
                                <telerik:GridRelationFields DetailKeyField="FHID" MasterKeyField="FHID" />
                            </ParentTableRelation>
                        </NestedViewSettings>
                         <NestedViewTemplate >
                             <table>
                                 <tr>
                                    <td align="left" colspan="3">
                                        <telerik:RadChart ID="RadChartFH" runat="Server"
                                                          Width="495px" AutoLayout="true" Skin="Mac">
                                            <ClientSettings EnableZoom="false" ScrollMode="XOnly" XScale="4" />
                                            <Series>
                                                <telerik:ChartSeries Name="ChartFH" DataYColumn="FHValue" Type="Line">
                                                    <Appearance FillStyle-MainColor="223, 87, 60">
                                                    </Appearance>
                                                </telerik:ChartSeries>
                                            </Series>
                                            <Legend Visible="false"></Legend>
                                            <ChartTitle TextBlock-Text="Scrolling only (initial XScale applied)">
                                            </ChartTitle>
                                        </telerik:RadChart>

                                    </td>
                                 </tr>
                             </table>
                       </NestedViewTemplate>
                      
                    </MasterTableView>
                    <ClientSettings AllowDragToGroup="true" >
                        <Selecting AllowRowSelect="true" />
                        <Scrolling AllowScroll="true" UseStaticHeaders="true" />
                    </ClientSettings>
          </telerik:RadGrid>

          <asp:SqlDataSource ID="SqlDataSource1" CancelSelectOnNullParameter="false" runat="server" ConnectionString="<%$ appSettings:XCareSqlConn%>"
               ProviderName="System.Data.SqlClient" SelectCommandType="StoredProcedure" SelectCommand="ChartFHData">
              <SelectParameters>
                   <asp:Parameter  Name="FHID" Type="String"/>
               </SelectParameters>          
              
          </asp:SqlDataSource>







         
  2. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 26 Mar 2012 Link to this post

    Hello,

    You could check this online demo application which implements similar scenario like yours. In the nested template you should click on the statistics chart tab to see the RadChart control integrated in the RadGrid.

    Give this demo a try and check whether this is the desired behavior.

    Greetings,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. yang
    yang avatar
    47 posts
    Member since:
    Oct 2010

    Posted 27 Mar 2012 Link to this post

    HI telerik:

    you can give me the Concrete  link address.

    I have look the all  demo many times.

    Thanks.


  5. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 28 Mar 2012 Link to this post

    Hello,

    Please, excuse me for the missing link. This is the link to the Hierarchy With Templates demo application.

    Regards,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  6. yang
    yang avatar
    47 posts
    Member since:
    Oct 2010

    Posted 28 Mar 2012 Link to this post

    Hello:

    This is a example you gave,I know. So do is ok.

    <
    telerik:RadPageView runat="server" ID="PageView3">
                                <telerik:RadChart ID="RadChart1" DataSourceID="SqlDataSource5" runat="server" OnItemDataBound="RadChart1_ItemDataBound"
                                    Width="465px" Height="260px" DefaultType="Pie" AutoLayout="true" AutoTextWrap="true"
                                    CreateImageMap="false">
                                    <ChartTitle>
                                        <TextBlock Text="Order Total">
                                        </TextBlock>
                                    </ChartTitle>
                                    <Series>
                                        <telerik:ChartSeries DataYColumn="spentMoney" Name="spentMoney" Type="Pie">
                                            <Appearance LegendDisplayMode="ItemLabels">
                                            </Appearance>
                                        </telerik:ChartSeries>
                                    </Series>
                                </telerik:RadChart>
                                <asp:SqlDataSource ID="SqlDataSource5" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
                                    SelectCommand="SELECT TOP 10 p.productId, p.ProductName as pName, sum(od.UnitPrice*od.Quantity) AS spentMoney, c.EmployeeID as cID, c.FirstName as cName FROM products as p, orders as o, [order details] as od, employees as c WHERE p.productID = od.productID and od.OrderID = o.OrderID and c.EmployeeID = o.EmployeeID and (c.EmployeeID = @EmployeeID) GROUP BY c.EmployeeID, c.FirstName, p.productID, p.ProductName, od.UnitPrice">
                                    <SelectParameters>
                                        <asp:ControlParameter ControlID="Label1" PropertyName="Text" Type="String" Name="EmployeeID" />
                                    </SelectParameters>
                                </asp:SqlDataSource>
                            </telerik:RadPageView>


    But I wan't use this way. I want  use storedprocedure and taking  parameter.
    But  Name="EmployeeID" can't  get value from Grid.
                      <NestedViewSettings>
                            <ParentTableRelation>
                                <telerik:GridRelationFields DetailKeyField="FHID" MasterKeyField="FHID" />
                            </ParentTableRelation>
                        </NestedViewSettings>

    <asp:SqlDataSource ID="SqlDataSource5" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" SelectCommand="Storedprocedure">
    <SelectParameters>
       <asp:ControlParameter ControlID="Label1" Name="EmployeeID" PropertyName="Text" Type="String  />
      </SelectParameters>
     </asp:SqlDataSource>



  7. yang
    yang avatar
    47 posts
    Member since:
    Oct 2010

    Posted 29 Mar 2012 Link to this post

    HI telerik:


    I have solved this question . I really  thank you  very much.

    Have a nice day!


    Regards
    Yang

  8. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 29 Mar 2012 Link to this post

    Hi,

    You could check this online resource for more information on how to use SQL DataSource with stored procedure and parameter.

    Greetings,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017