We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
|
@Grid
@(Html.EJ().Grid<OrdersView>("Grid")
.Datasource(ds => ds.URL(@Url.Action("DataSource"))
.Adaptor(AdaptorType.UrlAdaptor))
.AllowPaging()
.AllowFiltering()
.ClientSideEvents(e=>e.ActionBegin("actionBegin").Load("load"))
.Columns(col =>
{
. . .
})
)
<script type="text/javascript">
function actionBegin(args){
if (args.requestType == "filtering" && args.currentFilterObject[0].operator == "startswith") {
args.currentFilterObject[0].operator = "contains";
}
}
function load(args) {
this.model.filterSettings.immediateModeDelay = 500; //reduce the time delay for filter action
}
</script> |
Thank you Venkatesh Ayothi Ramanfor your answer.
Actually. I use FilterBarMode(FilterBarMode.OnEnter), so the filter process starts only when I press enter. In the video, I press enter after filling the nome field.
I forgot to post the view code which I report below:
@(Html.EJ().Grid<PazienteViewModel.Paziente>("tbPazienti")
.Locale("it-IT")
.Datasource(ds => ds
.URL(Url.Action("Lista"))
.InsertURL(Url.Action("Aggiungi"))
.UpdateURL(Url.Action("Modifica"))
.RemoveURL(Url.Action("Elimina"))
.Adaptor(AdaptorType.UrlAdaptor)
)
.EditSettings(x => x.AllowEditing().AllowEditOnDblClick(true).AllowAdding().AllowDeleting().ShowDeleteConfirmDialog())
.AllowFiltering().FilterSettings(filter => { filter.ShowFilterBarStatus().StatusBarWidth(500).FilterBarMode(FilterBarMode.OnEnter).FilterType(FilterType.FilterBar); })
.AllowPaging().PageSettings(x => x.PageSize(30))
.AllowScrolling()
.AllowSorting()
.AllowTextWrap()
.SelectionSettings(x => x.EnableToggle(true))
.IsResponsive(true).EnableResponsiveRow(true)
.GridLines(GridLines.Horizontal)
.ClientSideEvents(x => x.ActionFailure("OnActionFailure").ActionBegin("OnActionBegin").DataBound("OnDataBound").ActionComplete("OnActionComplete").Load("OnLoad"))
.Columns(col =>
{
col.Field(x => x.Id).IsPrimaryKey(true).Visible(false).Add();
col.Field(x => x.Cognome).Width(150).Add();
col.Field(x => x.Nome).Width(120).Add();
})
)
And JS code:
function OnActionBegin(args) {
//Cambio la modalità di ricerca predefinita per le stringhe. Contains invece di startswith
if (args.requestType == "filtering" && args.currentFilterObject[0].operator == "startswith") {
args.currentFilterObject[0].operator = "contains";
}
}
function OnActionFailure(args) {
toastr.error($(args.error.error.responseText).find('i').first().text());
}
function OnDataBound(args) {
fixDimensioniTabella(tb);
}
function OnActionComplete(args) {
if (args.requestType == "filtering") {
fixDimensioniTabella(tb);
}
}
function OnLoad(args) {
this.model.filterSettings.immediateModeDelay = 500; //reduce the time delay for filter action
}
Here, fixDimensioniTabella is a function which adjust the height of the table based on some parameters,
|
@(Html.EJ().Grid<OrdersView>("Grid")
.Datasource(ds => ds.URL(@Url.Action("DataSource"))
.Adaptor(AdaptorType.UrlAdaptor))
.AllowReordering()
.ToolbarSettings(toolbar =>
{
toolbar.ShowToolbar().ToolbarItems(items =>
{
items.AddTool(ToolBarItems.Add);
items.AddTool(ToolBarItems.Edit);
items.AddTool(ToolBarItems.Delete);
items.AddTool(ToolBarItems.Update);
items.AddTool(ToolBarItems.Cancel);
});
})
.AllowPaging()
.AllowFiltering().FilterSettings(filter => { filter.ShowFilterBarStatus().StatusBarWidth(500).FilterBarMode(FilterBarMode.OnEnter).FilterType(FilterType.FilterBar); })
.ClientSideEvents(e=>e.ActionBegin("actionBegin").Load("load"))
.Columns(col =>
{
col.Field(p => p.OrderID).HeaderText("Order ID").Add();
col.Field(p => p.CustomerID).HeaderText("Customer ID").TextAlign(TextAlign.Left).Add();
col.Field(p => p.ShipCity).HeaderText("ShipCity").Format("{0:C2}").Add();
col.Field(p => p.EmployeeID).HeaderText("FirstName").Add();
})
)
<script type="text/javascript">
function actionBegin(args) {
if (args.requestType == "filtering" && args.currentFilterObject[0].operator == "startswith") {
args.currentFilterObject[0].operator = "contains";
//here we can find the columns length and current filter field value
var len = this.model.columns.length, columns = this.model.columns, currentFilterField = args.currentFilterObject[0].field;
for (var i = 0; i < len; i++) {
//check the condition for any filterbarcell has value expect current filter barcell
if ($("#" + columns[i].field + "_filterBarcell").val().length > 0 && (columns[i].field != currentFilterField)) {
var filterCollection = { "field": columns[i].field, "operator": "contains", "predicate": 'and', "value": $("#" + columns[i].field + "_filterBarcell").val() } //create a filter object
args.filterCollection.splice(i - 1, 0, filterCollection);//insert filterobject into filtercollection array based on that index
}
}
}
}
</script> |
Thank you so much, it works!
