Select grid row item from code - kendo-ui-angular2

Is there any way to select a grid row from code so you can trigger the selectionChange event emitter? I don't know how to get hold of the grid component and execute the event manually.
Selection grid sample plunkr
<kendo-grid [data]="gridView" [selectable]="true"></kendo-grid>
--
Edit: If I access the grid manually by adding a #gridReference tag into the kendo-grid tag, I can access the component using
#ViewChild('activityGrid') gridReference: GridComponent;
But when executing
var selectionEvent = { index: 0, selected: false } as SelectionEvent;
this.gridReference.selectionChange.emit(selectionEvent);
It still doesn't work. It migth work when I have to access the SelectionService using unselect but that's a private class.
Updated plunkr

This could be achieved now by utilizing the new SelectionDirective. It allows specifying the key to be stored when selecting a row and also the selectedKeys collection to hold reference to the selected keys. This also allows to programatically modify the selection.

Unfortunately, currently it is not possible to select a row programmatically via the public API.
The selectionChange emitter is there to trigger the selectionChange event and I'm afraid it will not trigger the selection logic.

Related

How do I hide an entire row in a gird?

Is there a way to hide an entire row, not just a single column, in a grid? I'm tried PXUIField.SetVisible, PXUIField.SetVisibility, PXUISetVisible, and PXUISetVisibility, but none of them seem to work. I know that using PXUIField.SetEnabled(cache, row, false) disabled the entire row, but can I make an entire row invisible?
You need to make sure the row is not returned in the query (could override the view delegate and not return specific rows) or removed from the cache. I don't think there is anything that can hide a row using the UI related calls, but I have never come across the need for this to ever try it.
The usual pattern is to use a PXFilter DataView current DAC record to filter the PXSelect DataView bound to the grid.
The filter fields are often changed on screen directly by the user but you can also set the value of the current filter DAC record programmatically in event handlers to build more complex logic.
public PXFilter<DACFilter> Filter;
public PXSelect<DAC,
Where<DACFilter.field, Equal<Current<DACFilter.fieldFilter>>>> GridDataView;

Programmatically selecting a value in kendo-dropdownlist

It appears to not be possible to programmatically select a specific value in the Kendo DropDownList element. I checked the API, but wasn't able to find something to trigger this.
There is a selectionChange event, but this is triggered by manually selecting a value from the dropdown. I'm interested in programmatically selecting an event; is there any way to do this?
Kendo does not take the new value unless we trigger the change event for the drop-down list. Once we set the value we have to trigger the change event
var menulist = $("#menulist").data("kendoDropDownList");
dropdownlist.value("Top");
dropdownlist.trigger("change");
Add the following to the dropdown html tag: (selectionChange)="selectionChange($event)"
And add the following to your typescript code:
protected selectionChange(value): void {
console.log("The current value is: " + value)
}
To change the selected item from the code behind, use this: http://www.telerik.com/kendo-angular-ui/components/dropdowns/api/DropDownListComponent/#toc-value

PropertyGrid alike with dgrid

I'd like to create a PropertyGrid alike using dgrid (and dojo). As far as I can see, a single column may only contain a single editor type. Is there any workaround to have different editor controls for different cells in the same row?
The Editor mixin seems to create a single cached editor control per row, but maybe there is something I have missed.
Thanks a lot!
There is no mixin available to achieve the functionality that you have described. But, you could do one of the two things.
1) Instead of using editor, you could use the renderCell function in the columns to return different inputs/widgets depending on the column value/row data. In this case you would need handle the events and update the store.
2) If you still want to use editor, there is a workaround. by using dojo/aspect. You would need to listen to the insertRow method of the grid. And update the cell with appropriate widgets for the cell element. Below is the snippet for the same.
aspect.after(grid, "insertRow", lang.hitch(this, 'updateRowWidgets'));
function updateRowWidgets(rowElement){
var cell = grid.cell(rowElement, <columnid>);
var rowdata = cell.row.data;
var rowWidget = .... //Create your widget according to row data.
cell.element.widget = rowWidget;
return rowElement; // remember to return this.
}
Hope this was helpful.
UPDATE: The second option would work only with editOn, as the widget will be shown/added to grid after the editOn event, and you would be able to switch the widget before that happens. Otherwise the widgets would be added to the grid before insertRow is completed.

reset the record selection in PXGrid

We have a view delegate and we are returning custom results according to the filters specified. Once the result is available the user choose any record, say 3rd and uses it. Next time they might change the filter criteria, and the view delegate returns a different set of result.
Here it seems the grid is auto selecting the record in previous position (3).
how can i reset the selection to the first record?
<View>.Current = <FirstRecordINeed>;
<View>.Cache.ActiveRow = <FirstRecordINeed>;
I have tried setting the activeRow/current in view delegate and the filter row updated event. But doesnt work. Any help?
To get ability to affect grid's ActiveRow you should specify property SyncPositionWithGraph="true" in the px:PXGrid in aspx.
After that you can set <View>.Cache.ActiveRow in the view delegate and it will affect grid.

How to mark a multiple selection on a DataGrid control?

I've got a custom control based on a Datagrid. What I want to achieve is doing multiple selection of rows and then right click on the row selector to open a context menu.
What actually happens: Selection of multiple rows works fine until the user right clicks on the row selector. Once that is done, there is only one selected row the one over which the right mouse button was clicked.
What I need to happen: Allow the user to do a multiple selection (rows have a style for selection) and right click to open the context menu without loosing the previous selection.
What do I need to do?
No it doesn't happen like that at all. Make sure that you have DataGridView MultiSelect property set to TRUE. Then assign your ContextMenustrip control to the datagrid's ContextMenuStrip property.
That should do the work and multiple selection should remain on right mouse click as well unless in your code behind somewhere you are altering that.
In which case, you will have to debug and find out where and how.
Just revisited the code and found that I was not updating the SelectedItems IList:
Dispatcher.BeginInvoke(new Action(delegate
{
foreach (var item in e.RemovedItems)
{
SelectedItems.Add(item);
}
SelectedItemsList.Add(SelectedItem);
}), System.Windows.Threading.DispatcherPriority.ContextIdle, null);

Resources