How to select multiple rows of KendoUI Grid for Angular 4+ and move it to another kendoUI Grid -


i have 2 kendo grids(angular 4+ component) data coming rest api. have select , move data row first grid grid. example bindind grid this:

<div>              <kendo-grid [height]="450"                          [kendogridbinding]="viewavailablejobs"                          [scrollable]="scrollable"                          [selectable]="true"                                                     (selectionchange)="griduserselectionchange($event)">                <kendo-grid-column field="select" width="30" [locked]="true" [filterable]="false">                  <ng-template kendogridheadertemplate>                    <input type="checkbox" [checked]="false" />                  </ng-template>                  <ng-template kendogridcelltemplate let-dataitem="dataitem" let-rowindex="rowindex">                    <input type="checkbox" id="select {{dataitem.jobnumber}}" value="selected" name="cselection-{{dataitem.jobnumber}}"                           [checked]="selected"                           (change)="oncheckboxchange($event, dataitem, 'select')"                           (clicked)="setbuttonstates()" />                  </ng-template>                </kendo-grid-column>                  <kendo-grid-column field="jobnumber" title="job #" [width]="150" [locked]="true">                </kendo-grid-column>                <kendo-grid-column field="jobname" title="job name" [width]="320" [locked]="true">                </kendo-grid-column>                <kendo-grid-column field="jobstatusuid" title="job status" [width]="150" [locked]="true">                </kendo-grid-column>                             <kendo-grid-column field="projectnumber" title="project" [width]="150">                </kendo-grid-column>                <kendo-grid-column field="schedulenumber" title="schedule" [width]="150">                </kendo-grid-column>                <kendo-grid-column field="oename" title="poe" [width]="220">                </kendo-grid-column>                            </kendo-grid>  </div>

the other grid 2 has data, have add or have append data(if there existing data) grid datasource. binding through service, rest api this:

constructor(private jobservice: dataservice){}  public ngoninit(): void {        this.jobservice.getavailablejobs(this.projectstr, this.programstr).subscribe(req => {                      this.viewavailablejobs = req;                      this.totalavailablejobs = req.length;                                      });  }

just answering if else comes looking answer: can manipulating grid data source array. use array splice method extract rows array in grid 1 , generate new array. push new generated array grid 2 data source. also, grid not refreshing manipulating array data source, had remove paging kendo grid , worked.


Comments

Post a Comment

Popular posts from this blog

javascript - Create a stacked percentage column -

i have collection of data : var data = [ {"p301a":"10","p301b":"7","p301c":"7","p301d":"3","p301e":"8","p301f":"8","p301g":"8","p301h":"8","p301i":"8","p301j":"8","p301k":"8","p301l":"8","p301m":"8","p301n":"8","p301o":"8","age":"31-40 years","profesion":"2","position":"2"}, {"p301a":"5","p301b":"4","p301c":"4","p301d":"4","p301e":"4","p301f":"4","p301g":"4","p301h":"4","p301i":"4","p301j":"4","p301k":"4...
Read more

Optimising Firebase database by automatically overwriting data -

in firebase app have following structure: posts latest all users can write posts > latest . want limit entries 20 posts save space in database. , posts beyond 20 unnecessary never shown on homepage. how can limit posts 20, when user writes posts > latest posts @ end drop off (be deleted) automatically? this sample should you. you need : const max_log_count = 20; exports.removeold = functions.database.ref('/posts/latest/{postid}').oncreate(event => { const parentref = event.data.ref.parent; return parentref.once('value').then(snapshot => { if (snapshot.numchildren() >= max_log_count) { let childcount = 0; const updates = {}; snapshot.foreach(function(child) { if (++childcount <= snapshot.numchildren() - max_log_count) { updates[child.key] = null; } }); // update parent. removes children. ...
Read more

javascript - Angular UI-Grid customTemplate directive causing rows to load slowly/? -

Image
each grid cell can have more 1 customtemplate loaded. have directive holds watcher on model_col_field listen cell updates on scroll when dom rows updated , recompile celltemplate . without watcher , $compile rows repeat on scroll, showing same set of rows. is there more angular way of approaching or way improve performance? relevant controller code: create gridoptions.data & gridoptions.columndefs : var customtemp = '<div ng-repeat="opt in grid.appscope.colvalueoptionsmodel" ng-init="tempstring=model_col_field.clazz+opt.key;"><comparison-directive dbo="model_col_field" attobj="opt" fff="grid.appscope.getattributetemplate(tempstring)" /></div>'; $scope.gridoptions.columndefs = [ { name:'yindex',pinnedleft:true,celltemplate: customtemp, displayname:'index'}, { name:'col1',celltemplate: customtemp}, { name:'col2',celltemplate: c...
Read more