Provide TabIndex number into angularJs ng grid - angularjs

I am using ng grid and each row of the grid have a text box. I want to access all the textbox inside and outside of the grid using TAB Key according to provided tabIndex.
My plunker is here : http://plnkr.co/edit/ce4xnHJtYhRdwe6JvZSA?p=preview

set noTabInterference: true in gridOptions, updated recently

Related

How to hide some columns on toggle button in ui grid in Angular js

My ui grid loads with 10 columns.Based on toggle button. I need to make visible property false for 5 columns and ui should load with 5 columns. How to achieve programmatically
this is totally logic based question and totally depends on the developer how to handle this.
if you are showing your div dynamically you can add one object named as checked and set it true for first 5 and false for other 5. on toggle button you can make that first 5 false or second 5 true or you can handle in the way want using *ngIf condition on div.
if your div is not loading dynamically and they are hardcoded div, you can simply add 2 variable making them true or false and show div using ngIf.
in controller have a scope variable
$scope.show5Column = true; (Default will show those column)
and just add the ng-show property in the HTML tag which contain the grid column classes.
ng-show="show5column"
on toggle button, change the value of scope variable

How to change the color of the cell dynamically after the ui grid is loaded

Searched Stack Overflow and Google a lot but cannot understand how to change the background color of a cell in ui grid after the grid is loaded with values.
For example after a button press I want to change background color on the cell.
You can use Rowtemplate and override ui-grid-cell. In the rowTemplate, you can add ng-click function and do whatever you want to do inside that function.
One more option to add an html for cellTemplate and add ng-class, based on conditions update class and have css for that class accordingly.

changing cell template property in Angular UI Grid

I am working on Angular UI grid and I am trying to change the cell template property on button click but it is not affecting the UI grid.
Here is the punker and when I click on toggleDisplay name it is not getting changed.
check link:-
plnkr.co/edit/Q0WcJC37bSGF7Huet39Q?p=preview

How to Bind dynamic data in textbox when user selects row in a Grid

I am using AngularJS - 1.0.6 version. I have created sample application where I want data to be populated in the textbox when user selects row in a grid. I have a directive which will render textbox and bind data with ng-model property. The model which binds the data with ng-model is dynamic. for e.g. -
input.attr('ng-model', 'model["' + d.id.toLowerCase() + '"]');
I need to use Angular.copy method to copy selected Items data into another model object.
$scope.model = angular.copy($scope.selectedItems);
I have used the same model to bind Textbox and Label. The selected data is shown in Label but not in Textbox. Here is a plunkr link with sample -
http://plnkr.co/edit/948JfxAF8lbyq1xa3Fyu?p=preview
Can anyone help me to find the solution for it?
Thanks in advance!!!
I updated your plunker with a working example. You are going to have to pass in the index of the selected item to your dynamic input control. Plunker
input.attr('ng-model', 'model[0].' + d.id.toLowerCase());

ng-click does not work with Kendo grid cell template

I'm trying to use the kendo ui grid and display a link column in an AngularJS application. The column is rendered using a template. I'm using the AngularJS ng-click directive in the template to call a method when the link in a cell is clicked. ng-click does not appear to work in a column template.
Here is an example.
However a similar example that DOES NOT use a column template seems to work fine with ng-click.
Any help is greatly appreciated!

Resources