angularjs ui-grid set selectedItems - javascript

I'm trying to upgrade from ng-grid to ui-grid and i had no idea how to set the selected items on init.
Short explanation: I'm loading data from a database where some items are marked as shown to normal users and some not. When you open the app as admin the complete list should load an the marked items should be checked in the grid.
In ng-grid i had set the selectedItems property but in ui-grid this doesn't work anymore.
How does this work in the new ui-grid version?
Thanks for your help!

We had a similar problem with a table inside a popup.
We solved by calling selection api upon rendering with the following code:
var onRowsRendered = function(gridApi) {
rowsToSelect.forEach(function(row) {
gridApi.selection.selectRow(row);
}
};
Then inside of onRegisterApi:
gridApi.core.on.rowsRendered($scope, onRowsRendered);
PS: rowsToSelect is supposed to be a subset of row entities (i.e. an array made of some of the element of gridOptions.data)

Related

Syncfusion Grid Filter create UI is targeting wrong element for appending the html element

So, I just started on Syncfusion and it's annoying. I have <ejs-grid> with columnMenuOptions and Filter in the header in a angular project. When I try to create UI for the Filter menu, I am doing as follows:
Code
public filter: IFilter = {
ui: {
create: (args: {
target: Element;column: Column
}) => {
const flValInput: HTMLElement = createElement("input", {
className: "flm-input",
});
args.target.appendChild(flValInput);
});
read: //read
write: //write
}
}
<ejs-grid [columnMenuItems]="columnMenuItems" [allowFiltering]="true">
<e-columns>
<e-column field="Id" headerText='OrderNo' [filter]="filter">
</e-column>
</e-columns>
</ejs-grid>
My Issue
So, from what I understood is that the Filter menu created using ui is appending to the table column. So, my issue here is as my filter menu is a sub-menu of filter as in the image. But, the sub menu is appended to the table column. This makes the UI break. Since, the UI element created is appended to the table column its alignment is respective to the table header and not the filter menu.
My issue with UI
What I need
I want the created element to be respective to the Filter menu and not the table column. Any idea how to fix this. I want to append the element to another element instead of the column.
Based on your requirement you have added a custom filter component to a particular column in EJ2 Grid, when you try open the sub menu of the filter menu it is getting appended to the table column.
Using the code example and the screenshot provided we have prepared a sample, but we were not able to reproduce the mentioned issue. Hence we would like you to provide the following details so that we provide you a better solution.
• If possible replicate the mentioned problem in below sample.
• Share the complete Grid rendering code.
• Ensure whether you have rendered the grid in any third party component or inside any EJ2 components.
• If you have rendered the grid inside any third party component or EJ2 components, please provide the complete details of the component.
• Share the Syncfusion package version you are using.
Sample: https://stackblitz.com/edit/angular-ykhisf?file=app.component.ts

Servoy - Getting all data from db table to display as list

I am relatively new to Servoy and Javascript so that might be why i can't get this to work but here goes:
I am trying to get a label to display all of the data from a specific column from my database table in a list.
I tried to add a dataProvider but that adds only one record per page.
I need the items to be listed below each other so it makes it easier for me to see.
I have also tried adding:
function firstName(){
foundset.loadAllRecords();
return;
}
and setting it as an onRender to see if that displays everything
Thanks in advance
If you look for the answer then here it is:
Use a label and set the text of the label to
%%list_display%%
Set your form layout to Tableview
The answer for above was using Servoy Developer and PostgresSQl

Reset Webix datatable filter

I have a quite confusing question. I have a Webix datatable and trying to reset a filter (richSelectFilter) for a column. But it's acting not as I've expected. I tried
$$("table1").getFilter("title").config.value = "";
But nothing happens. Another attempt:
$$("table1").getFilter("title").config.value = "";
$$("table1").refreshColumns();
And filter was disappeared while values are still filtered!
Here's a short code snippet: http://webix.com/snippet/b34607aa
Am I doing something wrong? Will appreciate any help.
Try to use
$$("table1").getFilter("title").setValue("");
Here's a snippet http://webix.com/snippet/3eb45109
While you code will be correct for normal richselect control, filters in a datatable store the actual values in the column's config object. So you need to change it there, or just use the setValue API which will change value and will refresh the grid in the necessary way.

jqGrid Search UI Not Refreshing/Redrawing

I'm using jqGrid to get back some data. The grid get's rendered with data and when it's loaded I add a filter and reload the grid. This basically removes certain files from the view upon first page load.
I have a checkbox on the page which toggles between two filters (including this data & excluding this data), each time it applies the filter then reloads the grid.
If I click the search button, the search popup displays my filter that I've just added.
If I then close it, change the filter through clicking this checkbox (it changes the data), then open the search popup again, my newly applied and obviously working filter is not displayed, only the previous filter!? No matter how many times I toggle the filter with the check box (which every time works to change the data), the filter in the popup does not change to what the current filter really is. Any ideas please?
I've found the solution...
"use strict";
/*global xmlJsonClass, jQuery, $ */
var rp_ge = {};
$.jgrid.extend({
searchGrid : function (p) {
p = $.extend({
recreateFilter: false,
drag: true,
sField:'searchField',
sValue:'searchString',
sOper: 'searchOper',
sFilter: 'filters',
recreateFilter was being set to false from within the library JS file on every 'reload' of the grid. So every time I added a new filter this was being reset to NOT recreate the filters in the popup.
Setting this to true solved the problem.

Angularjs ng-grid change page but lose selectedItems

I am new to AngularJS and I started integrating with ng-grid. According to official site http://angular-ui.github.io/ng-grid/, there's a property "selectedItems" that you can set your list of selected items in current scope
selectedItems:$scope.mySelectedItems
I have no problem of getting selected list items in the current $scope.gridOptions. HOWEVER, I have no idea what to do when I change the page(FOr example using self-defined pagination) or when I need to reload the current gridOptions (for example user launched a new search creteria). Where I should re-initialize selectedItems?
I thought of 2 solutions but they wont work:
1.make a whole list of server data and do pagination on client side. It will remain selectedItems and show them correctly on the screen when I change pages. But when user launch a new search, I re-init selectedItems = [] in search Method. Unfortunately, when I select again in grid, selectedItems will always remains empty.
2.It's much pratical let server do pagination. In this case, how can I remember selectedItems and show them correctly on screen? Server-side paging exemple of Ng-grid has a bug when you change pages: it keeps selectedItems in $scope but lose them on UI. In this case, where I can init selectedItems?
got the solution:
https://github.com/angular-ui/ng-grid/pull/209
bascially specify the primaryKey column of gridOptions
$scope.gridOptions.primaryKey = 'FileRowNo';
and everything would work

Categories