Ihave one issue regarding @(Html.Infragistics().Grid).
The details are given below.
First of all I have taken a grid inside a div.and calling like below. so data is displaying and everything is working fine.<div id="igGridLoanPipeline" class="pipeline_content">
<div id="divNewPipeline"> @(Html.Infragistics().Grid<LoneOakOrigination.Domain.CustomEntities.LoanPipeline>() .ID("igGridPipeline") .AutoGenerateColumns(false) .PrimaryKey("PKLoanID") .RenderCheckboxes(true) .Virtualization(false) .ShowHeader(true) .FixedHeaders(true) .Columns(column => { column.For(x => x.Active).DataType("bool").HeaderText("Active").Width("50px"); column.For(x => x.FriendlyLoanID).DataType("string").HeaderText("ID").Width("80px"); column.For(x => x.LoanName).DataType("string").HeaderText("Loan Name").Width("140px"); column.For(x => x.Address).DataType("string").HeaderText("Address").Width("150px"); column.For(x => x.PropertyType).DataType("string").HeaderText("Property Type").Width("105px"); column.For(x => x.LoanAmount).DataType("string").HeaderText("Loan Amount").Width("130px").Format("currency");
column.For(x => x.TotalLTV).DataType("string").HeaderText("LTV").Width("65px"); column.For(x => x.PrimaryContact).DataType("string").HeaderText("Primary Contact").Width("130px"); column.For(x => x.TransactionType).DataType("string").HeaderText("Transaction Type").Width("125px"); column.For(x => x.Status).DataType("string").HeaderText("Status").Width("90px"); column.For(x => x.LoanOfficer).DataType("string").HeaderText("Loan Officer").Width("110px");
column.For(x => x.UpdatedOn).DataType("date").HeaderText("Date Modified").Format("MM/dd/yyyy").Width("110px"); column.For(x => x.PKLoanID).DataType("number").HeaderText("ID").Hidden(true); }) .Features(features => { features.Filtering();
features.Paging().PageSize(50).ShowPageSizeDropDown(true).PageSizeDropDownLabel("Show").PageSizeDropDownTrailingLabel("records").PageSizeDropDownLocation("above").ShowPagerRecordsLabel(true).PrevPageLabelText("Previous").NextPageLabelText("NEXT").VisiblePageCount(5); features.Sorting().Mode(SortingMode.Single).ColumnSettings(settings => { //{ columnKey: "UpdatedOn", allowSorting: true, firstSortDirection: "ascending", currentSortDirection: "descending" }, settings.ColumnSetting().ColumnKey("UpdatedOn").AllowSorting(true).FirstSortDirection("ascending").CurrentSortDirection("descending");
}); features.Selection().MouseDragSelect(true).MultipleSelection(false).Mode(SelectionMode.Row).MultipleCellSelectOnClick(false); features.Resizing();
}) .ClientDataSourceType(ClientDataSourceType.JSON) .DataSourceUrl(Url.Action("PipeLineGridData", "Home")) .LoadOnDemand(true) .Height("600") .LocalSchemaTransform(false) .DataBind() .Render() ) </div>
Then I have a search textbox with search input button.Based on searh option I need to display filtered data in the above grid.But I am unable to bind it to the above grid.As the grid is not rendering perfectly and losing features of paging and filtering.
So, can you please suggest me how to solve this above issue.How to rebind the above grid in a search button.
Thanks and Regards,
sree
Hi, Shahin.
Thank you for the patience. I have a solution that I hope will help you resolve your case. It doesn't depend on if you want to search on the client or on the server. The solution uses the igGrid filtering API and therefore the grid will do the filtering internally and depending on the configuration it will be on the server or on the client. When you click the link that I've sent you, on the "Methods" tab, the "filter" method can be found. It simulates the filtering the same way as it can be done from the igGrid UI.
If what you want to achieve is to search for a certain value in entire grid, this means that you want to search all the columns for that value. Therefor if you filter all the columns by that value you will filter the grid. The "filter" method allows you to do exactly this - as an array you can list the filter conditions you want. Let's say the word we want to search is "geek". The code below can do the filtering:
$("#grid1").igGridFiltering("filter", [
{ fieldName: "Name", cond: "contains", expr: "geek", logic: "OR" },
{ fieldName: "ProductNumber", cond: "contains", expr: "geek", logic: "OR" } ], true); });
Notice that the "logic" is OR in all the conditions and that's in order to return a result if it is available at least at one of the grid columns. If the grid column is of type number this means that the "expr" should be also from type number.
I hope this you help you, but if you have further questions, don't hesitate to ask them.
Best regards, Nikolay Alipiev
I want to ask you if you had the time to check the solution that I've proposed you and it worked for you. Just let me know if you need further assistance and if you have more questions don't hesitate to ask me.