Posted 18 February 2021, 10:32 pm EST - Updated 3 October 2022, 4:22 am EST
Custom search input search with grid
Posted by: bemes9226 on 18 February 2021, 10:32 pm EST
-
-
Posted 21 February 2021, 11:18 pm EST
Hi,
Please refer to the demo link below:
https://www.grapecity.com/wijmo/demos/Grid/Master-Detail/SeparateGrids/angular
This sample demonstrates two different scenarios. Your requirement can be fulfilled by second scenario.
Regards,
Ashwin -
Posted 22 February 2021, 11:41 pm EST
left side text boxes i have filled the text and clicked on search button am unable to get the filter row.give me a example of filter with search button.
-
Posted 23 February 2021, 5:45 pm EST
Hi,
Sorry, but I was unable to understand your requirements properly. Can you please explain it in detail and provide some examples that demonstrates your requirements.
~regads
-
Posted 23 February 2021, 5:57 pm EST - Updated 3 October 2022, 4:22 am EST
check below image.i have leftside checkboxs with search and clear buttons.
when i fill the entityname field “SDL”,then clicked search button show the respective filter data in the right side of the grid.when user clicks clear button clear the grid and show the all the data. -
Posted 23 February 2021, 5:58 pm EST
<ng-template #content let-c=“close” let-d=“dismiss” class=“modal”>
<button type=“button” class=“close” aria-label=“Close” (click)=“d(‘Cross click’)”>
Search Client Name & Number
Search Criteria
Entity Name
<input bentoReset class=“form-control” type=“text”
(input)=“flexGrid.collectionView.refresh()”
[(ngModel)]=“EntityName” placeholder=“Search” />
Entity ID
<input bentoReset class=“form-control” type=“text”
(input)=“flex.collectionView.refresh()”
[(ngModel)]=“ClientName” placeholder=“Search” />
Entity Type
<input bentoReset class=“form-control” type=“text”
(input)=“flex.collectionView.refresh()”
[(ngModel)]=“ClientName” placeholder=“Search” />
Client Name
<input bentoReset class=“form-control” type=“text”
(input)=“flex.collectionView.refresh()”
[(ngModel)]=“ClientName” placeholder=“Search” />
Client Number
<input bentoReset class=“form-control” [(ngModel)]=“ClientNumber” type=“text”
(input)=“flex.collectionView.refresh()” name=“demoSearch” placeholder=“Search” />
Entity Group
<input bentoReset class=“form-control” type=“text”
(input)=“flex.collectionView.refresh()”
[(ngModel)]=“ClientName” placeholder=“Search” />
Location
<input bentoReset class=“form-control” type=“text”
(input)=“flex.collectionView.refresh()”
[(ngModel)]=“ClientName” placeholder=“Search” />
</div> <div class="row margin-down"> <button type="button" class="btn btn-outline-primary" (click)="getFilter()">Search</button> <button type="button" class="btn btn-outline-primary margin-left" (click)="flex.collectionView.sortDescriptions.clear();">Clear</button> </div> </div> </div> <div class="col-8"> <div class="container-fluid"> <!-- <wj-flex-grid [deferResizing]="true" #flex [itemsSource]="data" (initialized)="init(flex)"> </wj-flex-grid> -->
<wj-flex-grid #flex [itemsSource]=“EntitylookupData” (dblclick)=“onRowDblclicked(flex);getEntityData();c(‘Close click’)”
(initialized)=“init(flex)” style=“height: 413px;”>
<wj-flex-grid-column [binding]=“‘TenantName’” [header]=“‘Client Name’”>
<wj-flex-grid-column [binding]=“‘TenantNumber’” [header]=“‘Client Number’”>
<wj-flex-grid-column [binding]=“‘Name’” [header]=“‘Entity Name’”>
<wj-flex-grid-column [binding]=“‘Number’” [header]=“‘Entity Number’”>
Ok Cancel -
Posted 23 February 2021, 6:01 pm EST
open(content) {
this.drawerService.EntityGetForLookUp(SearchOnlyUsedValues, ModuleName, DrawerID, SearchCriteria, SortField, SortDir, PageSize, PageIndex, ApplyLocationFilter).subscribe(item => { debugger; this.EntitylookupData = new CollectionView(item.EntitiesCollection) console.log("lookup1", this.EntitylookupData); }); // Add 'modal-scroll' class to modal window const options = { windowClass: 'modal-scroll', ariaLabelledBy: 'modal-scrollable-title' }; this.modalService.open(content, options).result.then(result => { this.closeResult = `Closed with: ${result}`; }, reason => { this.closeResult = `Dismissed ${this.getDismissReason(reason)}`; });
}
-
Posted 24 February 2021, 6:51 pm EST
Hi,
Please refer to the sample link below that demonstrates your requirements:
https://stackblitz.com/edit/angular-9-0-0-rc-1-v42lbc
You should use the filters property of CollectionView because you will apply multiple search keys on the items.
~regards
-
Posted 29 June 2021, 3:53 pm EST
Hi,
As per my understanding, you want to search the text with an asterisk(*). I have created a sample demonstrating the same:
https://stackblitz.com/edit/angular-9-0-0-rc-1-r6jrv1
In the above sample adding * in the prefix of the searched text shows items having searched text in the prefix(starts with), and adding * at the end of the searched text will make the grid show text ending with searched text. You can also search text without an asterisk.
Let us know if you have any other requirements than this. Also if that’s the case please give more information about the requirement so that can help you more.~regards
-
Posted 29 June 2021, 11:51 pm EST
expecting:
-
Posted 29 June 2021, 11:51 pm EST - Updated 3 October 2022, 4:23 am EST
-
Posted 1 July 2021, 12:32 am EST
Hi,
As per my understanding, you want to maintain the selection of the rows after the search happens in the grid. If so you can store the selected rows and restore them on the searched grid and after the search ended. Please refer to the sample below:
https://stackblitz.com/edit/angular-9-0-0-rc-1-ug3zsk
Let us know if you need any further assistance.
~regards
-
Posted 6 July 2021, 3:24 am EST
need to move cursor one place to other hover also background color appear
-
Posted 6 July 2021, 10:52 pm EST
Hi,
As per our understanding, your requirement is to change the background color of the row when hovered. You may refer to the sample link below for this:
https://stackblitz.com/edit/angular-9-0-0-rc-1-dfoa4c
Let me know if this was your requirement.
~regards