Category / Section
How to select the content in Grid cells
3 mins read
You can select the content in the cell by disabling “enableTouch” property of Grid. The following code example shows how to select the content in the cell of the Grid.
- Render the Grid control.
JS
<div id="Grid"></div> <script type="text/javascript"> $(function () {// Document is ready. $("#Grid").ejGrid({ dataSource: window.gridData, allowPaging: true, enableTouch: false, // To select the content in the cell. columns: [ { field: "OrderID", headerText: "Order ID", width: 100 }, { field: "CustomerID", headerText: "Customer ID", width: 100 }, { field: "Freight", headerText: "Freight", width: 100, format: "{0:C}" }, { field: "ShipCountry", headerText: "Ship Country", width: 100 }, ], }); }); </script>
MVC
[In View] @(Html.EJ().Grid<object>("Grid") .Datasource((IEnumerable<object>)ViewBag.data)) .AllowPaging() .EnableTouch(false) .Columns(col => { col.Field("OrderID").HeaderText("OrderID").Width(100).Add(); col.Field("CustomerID").HeaderText("Customer ID").Width(100).Add(); col.Field("Freight").Width(100).Format("{0:C}").Add(); col.Field("ShipCountry").HeaderText("Ship Country").Width(100).Add(); }) )
[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="Grid" runat="server" AllowPaging="True" EnableTouch=”False" > <Columns> <ej:Column Field="OrderID" HeaderText="Order ID" Width="100"/> <ej:Column Field="CustomerID" HeaderText="Customer ID" Width="100"/> <ej:Column Field="Freight" HeaderText="Freight" Format="{0:C}" Width="100"/> <ej:Column Field="ShipCountry" HeaderText="Ship Country" Width="100"/> </Columns> </ej:Grid>
[CS] public partial class _Default : Page { protected void Page_Load(object sender, EventArgs e) { this.Grid.DataSource = new NorthwindDataContext().Orders. ToList(); this.Grid.DataBind(); } }
The following output is displayed as a result of the above code example.
Figure: Select the content in the cell