Category / Section
How to disable paging on mouse swipe?
1 min read
The Mouse swipe to a page can be disabled by setting the enableTouch property to false, and this also enables the text of the Grid to be selected. By default, the enableTouch property is set to true.
The following code example demonstrates how to disable the Mouse swipe to a page in the Grid.
JS
<div id="Grid"></div> <script type="text/javascript"> $(function () { $("#Grid").ejGrid({ dataSource: window.gridData, allowPaging: true, enableTouch: false, columns: [ { field: "OrderID", headerText: "Order ID", width: 75, textAlign: ej.TextAlign.Right }, { field: "CustomerID", headerText: "Customer ID", width: 80 }, { field: "EmployeeID", headerText: "Employee ID", width: 75, textAlign: ej.TextAlign.Right }, { field: "Freight", width: 75, textAlign: ej.TextAlign.Right }, { field: "OrderDate", headerText: "Order Date", width: 80, textAlign: ej.TextAlign.Right } ] }); }); </script>
MVC
@(Html.EJ().Grid<OrdersView>("FlatGrid") .Datasource((IEnumerable<object>)ViewBag.datasource) .AllowPaging() .EnableTouch(false) .Columns(col => { col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right). Add(); col.Field("CustomerID").HeaderText("Customer ID"). Add(); col.Field("EmployeeID").HeaderText("Employee ID"). Add(); col.Field("Freight").HeaderText("Freight "). Add(); col.Field("OrderDate").HeaderText("Order Date"). Add(); }))
ASP
<ej:Grid ID="OrdersGrid" runat="server" AllowPaging ="true" EnableTouch="false " > <Columns> <ej:Column Field="OrderID" HeaderText="Order ID" IsPrimaryKey="True" TextAlign="Right" /> <ej:Column Field="CustomerID" HeaderText="Customer ID" Width="120" /> <ej:Column Field="EmployeeID" HeaderText=" EmployeeID" Width="100" /> <ej:Column Field="Freight" HeaderText=" Freight" Width="80" /> <ej:Column Field="OrderDate " HeaderText=" OrderDate " Width="120" /> </Columns> </ej:Grid>
The following screenshot displays the Enable Touch disabled in the Grid: