Category / Section
How to format and add isPrimaryKey property to auto generated columns?
1 min read
We can format the auto generated column using dataBound event. While we remove the columns property, grid will automatically generate the column using the field name of the dataSource.
The following code example shows how to format and add primaryKey to grid column.
function dataBound(args) { for (var column = 0; column < this.model.columns.length; column++) { if (this.model.columns[column]["type"] == "number") //Align based on column field this.model.columns[column].textAlign = "right"; if (this.model.columns[column]["field"] == "EmployeeID") //Adding primary key based on field this.model.columns[column].isPrimaryKey = true; else if (this.model.columns[column]["field"] == "Freight") //Formating based on field this.model.columns[column].format = "{0:C}"; } this.refreshContent(true); //Reflect the changes in grid }
JS
<div id="Grid"></div> <script type="text/javascript"> $(function () {// Document is ready. $("#Grid").ejGrid({ dataSource: data, // the datasource "data" is referred from jsondata.min.js dataBound: "dataBound", }); }); </script>
MVC
[In View] @(Html.EJ().Grid<object>("Grid") .Datasource((IEnumerable<object>)ViewBag.data) .ClientSideEvents(eve=>eve.DataBound("dataBound")) ) [Controller] namespace EJGrid.Controllers { public class HomeController : Controller { public ActionResult Index() { var DataSource = OrderRepository.GetAllRecords(); ViewBag.data = DataSource; return View(); } } }
ASP.NET
[aspx] <ej:Grid ID="OrdersGrid" runat="server" > <ClientSideEvents DataBound="dataBound" /> </ej:Grid> [CS] public partial class _Default : Page { protected void Page_Load(object sender, EventArgs e) { this.OrdersGrid.DataSource = new NorthwindDataContext().Orders; this.OrdersGrid.DataBind(); } }
Screen shot:
Formatted of auto generated column