This is a migrated thread and some comments may be shown as answers.

Open Lightbox from Radgrid with parameters

1 Answer 86 Views
LightBox
This is a migrated thread and some comments may be shown as answers.
nav100
Top achievements
Rank 1
nav100 asked on 02 Dec 2013, 02:34 AM
Hi,

How can I pass parameters to Lightbox from Radgrid Item_DataBound? I am trying to bind RadHtmlChart based on RadGrid DataKey value. Here is my code. Could you please let me know? I am not sure how to do this. I just upgraded our projects to new controls. Thanks for any help.


  <telerik:RadLightBox ID="RadLightBox1" runat="server" width="400px" height="350px">
    <Items>
        <telerik:RadLightBoxItem>
            <ItemTemplate>
                    <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Transitions="true" Skin="Metro"
                                    OnClientSeriesClicked="OnClientChartClicked">
                                    <PlotArea>
                                        <Series>
                                            <telerik:PieSeries DataFieldY="total" NameField="office" ColorField="PartyColor"
                                                ExplodeField="IsExploded">
                                                <LabelsAppearance DataFormatString="{0}" >
                                                </LabelsAppearance>
                                            </telerik:PieSeries>
                                        </Series>
                                    </PlotArea>
                                </telerik:RadHtmlChart>
            </ItemTemplate>
            </telerik:RadLightBoxItem>
            </Items>
    </telerik:RadLightBox>



 <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" GridLines="None"
                                Skin="Office2007" Width="600px" Style="height: auto;" OnItemDataBound="RadGrid1_ItemDataBound">
                                <MasterTableView ShowHeadersWhenNoRecords="true" DataKeyNames="type_id">
                                    <Columns>
                                        <telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="Name"
                                            HeaderText="Name" ReadOnly="True" UniqueName="Name">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn DataField="count" HeaderText="Total" UniqueName="count">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridHyperLinkColumn Text="View Details" UniqueName="viewDeatils" />
                                    </Columns>
                                </MasterTableView>
                            </telerik:RadGrid>
Code behind
-----------------------------------------------
       protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
        {
            if (e.Item is GridDataItem)
            {
                GridDataItem item = (GridDataItem)e.Item;
                HyperLink link = (HyperLink)item["viewDeatils"].Controls[0];
                int index = item.ItemIndex;
               link.Attributes.Add("onclick", String.Format("ShowGraph('{0}');", item.GetDataKeyValue("type_id").ToString()));
            }

Javascript:
----------------------

     function ShowGraph() {
                var lightBox1 = $find('<%= RadLightBox1.ClientID %>');
                lightBox1.show();
            }


        }

1 Answer, 1 is accepted

Sort by
0
Kostadin
Telerik team
answered on 03 Dec 2013, 10:43 AM
Hello Nara,

Since you are using an ItemTemplate, the template will be render after the LightBox is opened. A possible solution to pass a parameters to RadHtmlChar is to save the ID into a HiddenField and after you get the char client object to use the id to bind it. Please check out the following code snippet.
JavaScript:
<script type="text/javascript">
    function OpenLightBox(index) {
        $get('<%= HiddenField1.ClientID %>').value = index;
        var lightBox = $find('<%= RadLightBox1.ClientID  %>')
        lightBox.show();
    }
 
    function LightBoxShowed(sender, args) {
        var ID = $get('<%= HiddenField1.ClientID %>').value;
        var htmlChar = $telerik.findControl(sender.get_element(), "RadHtmlChart1");
        //after you find the char you could bind it by using the ID
    }
</script>
ASPX:
<asp:HiddenField runat="server"  ID="HiddenField1" />

Regards,
Kostadin
Telerik
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 the blog feed now.
Tags
LightBox
Asked by
nav100
Top achievements
Rank 1
Answers by
Kostadin
Telerik team
Share this question
or