Create Grid Programmatically with Client Side Events

[Michael Diaz]

Hi,

Is there a way to add (define) the client side events (DetailsDataBound) to a programmatically created Grid?

I'm using Asp.Net Web Forms with C# and Syncfusion Web v19.1.0.54. I have an Accordion defined in my .aspx page but i'm creating every AccordionItem on server side by using a loop. On each AccordionItem i'm creating a Grid with all it's definitions (ID, dataSource, AllowPaging, etc...). All of that is working fine except when i add the client side event for DetailsDataBound. I'm getting an error "Object reference not set to an instance of an object" "Syncfusion.JavaScript.Web.Grid.ClientSideEvents.get returned null".

The javascript function is already defined in the .aspx page.

Here is a code example.

.aspx

<ej:Tab ID="ejDataTab" runat="server" SelectedItemIndex="0" Collapsible="true"  >

    <Items>

        <ej:TabItem ID="tabSites" Text="Site">

            <ContentSection>

                <ej:Accordion ID="accLocations" runat="server" HeightAdjustMode="Content" EnableMultipleOpen="false" EnablePersistence="true" >

                </ej:Accordion>

            </ContentSection>

        </ej:TabItem>        

    </Items>

</ej:Tab>

.cs

private void LoadAccordion(){

    List<EntityData> locations = uow.GetLocations(ID).ToList();

    Label lblTitle;

    AccordionItem acc;

    Grid grid1;                        

    foreach (EntityData loc in locations)

        {

        lblTitle = new Label();                            

        lblTitle.Text = loc.Location1 + ", " + loc.Location2;                            

        acc = new AccordionItem();

        acc.Text = lblTitle.Text;

        acc.ID = "pane_" + loc.LocationId.ToString();

        

        List<EntitySite> sites = uow.GetSitess(otherId).ToList();

        if (sites != null && sites.Count() > 0)

        {

            grid1 = new Grid();

            grid1.ID = "siteGridLocation_" + loc.LOCATION_ID.ToString();

            grid1.Columns.Clear();

            grid1.EnableViewState = false;                            

            grid1.DataSource = sites.ToList();

            grid1.DataBind();

            grid1.DetailsTemplate = "#sitesDetailsTemplate";        

            grid1.ClientSideEvents.DetailsDataBound = "grid1DetailGridData";        

            grid1.AllowPaging = true;

            acc.ContentSection.Controls.Add(grid1);

        }

        accLocations.Items.Add(acc);                    

        accLocations.EnablePersistence = true;                            

    }

}

Thanks,

-Michael

[Pon Selva Jeganathan]

Hi Michael,    

   

Thanks for contacting syncfusion forum.  

  

Query: Create Grid Programmatically with Client Side Events

 

We are able to reproduce the problem on our end from your provided details. The client-side event is not declared properly so this problem occurs. To overcome this problem the client-side event is assigned to the instance of a grid model. Please refer to the code snippet below,  

    

Default.aspx.cs 

  

…… 

private void LoadAccordion() 

        { 

            … 

  

            foreach (Orders loc in locations) 

            { 

                 

                    grid1.DataBind(); 

                    grid1.DetailsTemplate = "#sitesDetailsTemplate"; 

                    grid1.Model.DetailsDataBound = "grid1DetailGridData"; 

                    grid1.AllowPaging = true; 

….. 

            } 

        }……. 

                     

  

Please refer to the below screenshot, 

  

Marked as answer

[Michael Diaz]

Thank you. That change to the grid model is working.

[Pon Selva Jeganathan]

Hi Michael,  

 

Thanks for the update. 

 

We are glad to hear that query has been resolved.   

   

Kindly get back to us for further assistance. We are happy to assist you. 

Regards,  

Pon selva