Columna en Grid

[Jessica]

¿Como puedo añadir un dropdowlist en un grid, desde una columna  Template?

[Prasanna Kumar Viswanathan]

Hi Jessica, 

Thanks for contacting Syncfusion support. 

Query : How can I add a dropdowlist in a grid, from a Template column? 

 

We already have a Knowledge base documentation on how to render other Syncfusion controls in grid. Please refer the below link for KB document. 

KB link: https://www.syncfusion.com/kb/6798/how-to-display-syncfusion-controls-in-grid-columns 

In above mentioned KB we have rendered the Rating column. To render the dropdownlist please refer the below code example. 

<script type="text/x-jsrender" id="columnTemplate"> 

 

    <input type="text" class="dropdown" /> 

 

</script> 

 

 

   <ej:Grid ID="FlatGrid" runat="server" AllowSorting="True" AllowPaging="True" IsResponsive="true"> 

       <ClientSideEvents templateRefresh="template" /> 

            <Columns> 

                <ej:Column Field="OrderID" HeaderText="Order ID" IsPrimaryKey="True" TextAlign="Right" Width="75" /> 

                <ej:Column Field="CustomerID" HeaderText="Customer ID" Width="80" /> 

                <ej:Column Field="EmployeeID" HeaderText="Employee ID" TextAlign="Right" Width="75" Priority="4" /> 

                <ej:Column Field="Freight" HeaderText="Freight" TextAlign="Right" Width="75" Format="{0:C}" Priority="3" /> 

                <ej:Column Field="ShipCity" HeaderText="Ship City" Width="110" Priority="2" /> 

                <ej:Column HeaderText="Dropdown" Template="#columnTemplate" Width="150" /> 

            </Columns> 

        </ej:Grid> 

 

    <script> 

        function template(args) { 

            var Customers = [ 

                 { id: "1", text: "ALFKI" }, { id: "2", text: "ANATR" }, { id: "3", text: "ANTON" }, 

                 { id: "4", text: "AROUT" }, { id: "5", text: "BERGS" }, { id: "6", text: "BLAUS" } 

            ]; 

            $(args.cell).find(".dropdown").ejDropDownList({ 

                dataSource: ej.DataManager(Customers), 

                fields: { id: "id", text: "text", value: "text" }, 

                selectedIndex:1 

            }); 

        } 

    </script> 

Please refer the below documentation for details of dropdownlist. 

https://help.syncfusion.com/js/dropdownlist/getting-started 

If you need any further assistance please get back to us. 

Regards, 

Prasanna Kumar N.S.V 

 

[Jessica]

¡Muchas gracias! Si me sirvió el ejemplo.  Era lo que necesitaba :)

[Prasanna Kumar Viswanathan]

Hi Jessica, 

Sorry for the inconvenience caused. 

As per your request we have attached the sample and please download the sample from the following link 

Sample: http://www.syncfusion.com/downloads/support/forum/139633/7z/Template_column-1317865386.7z 

  

Regards, 

Prasanna Kumar N.S.V 

[Jessica]

¡Gracias!

[Prasanna Kumar Viswanathan]

Hi Jessica, 

Thanks for the update. 

Please get back to us if you need any further assistance. 

Regards, 

Prasanna Kumar N.S.V