EasyUI Forum
March 28, 2024, 01:14:57 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: How to cache various editor in datagrid?  (Read 7919 times)
softboy99
Newbie
*
Posts: 43


View Profile Email
« on: May 31, 2018, 06:41:22 PM »

How to cache various editor in datagrid?
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: May 31, 2018, 07:42:29 PM »

Don't worry about that, angular does it all for you.
Logged
softboy99
Newbie
*
Posts: 43


View Profile Email
« Reply #2 on: June 05, 2018, 06:24:13 PM »

Is there any demo?
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 on: June 06, 2018, 02:24:17 AM »

Please look at this example https://www.jeasyui.com/demo-angular/main/index.php?plugin=DataGrid&theme=material-teal&dir=ltr&pitem=Row%20Editing&sort=asc
Logged
softboy99
Newbie
*
Posts: 43


View Profile Email
« Reply #4 on: June 06, 2018, 05:53:53 PM »

Hi,
In your demo code, you use  ng-template in the template, How to assign the editor to the column in code dynamically?
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #5 on: June 07, 2018, 02:23:41 AM »

Please look at this code:
Code:
import { Component } from '@angular/core';

@Component({
selector: 'app-root',
template: `
<h2>Row Editing</h2>
<eui-datagrid [data]="data" [clickToEdit]="true" editMode="row" style="height:250px">
            <eui-grid-column *ngFor="let col of columns"
                    [field]="col.field"
                    [title]="col.title"
                    [editable]="true">
                <ng-container *ngIf="col.editor">
                    <ng-template *ngIf="col.editor=='numberbox'" euiEditTemplate let-row="row">
                        <eui-numberbox [(ngModel)]="row[col.field]"></eui-numberbox>
                    </ng-template>
                    <ng-template *ngIf="col.editor=='checkbox'" euiEditTemplate let-row="row">
                        <eui-checkbox [(ngModel)]="row[col.field]" style="width:20px;height:20px"></eui-checkbox>
                    </ng-template>
                </ng-container>
            </eui-grid-column>
</eui-datagrid>
`
})
export class AppComponent {
    columns = [
        {field:'itemid',title:'Item ID'},
        {field:'name',title:'Name'},
        {field:'listprice',title:'List Price',editor:'numberbox'},
        {field:'unitcost',title:'Unit Cost',editor:'numberbox'},
        {field:'attr',title:'Attribute'},
        {field:'status',title:'Status',editor:'checkbox'}
    ];
data = [
{"code":"FI-SW-01","name":"Koi","unitcost":10.00,"status":true,"listprice":36.50,"attr":"Large","itemid":"EST-1"},
{"code":"K9-DL-01","name":"Dalmation","unitcost":12.00,"status":true,"listprice":18.50,"attr":"Spotted Adult Female","itemid":"EST-10"},
{"code":"RP-SN-01","name":"Rattlesnake","unitcost":12.00,"status":true,"listprice":38.50,"attr":"Venomless","itemid":"EST-11"},
{"code":"RP-SN-01","name":"Rattlesnake","unitcost":12.00,"status":true,"listprice":26.50,"attr":"Rattleless","itemid":"EST-12"},
{"code":"RP-LI-02","name":"Iguana","unitcost":12.00,"status":true,"listprice":35.50,"attr":"Green Adult","itemid":"EST-13"},
{"code":"FL-DSH-01","name":"Manx","unitcost":12.00,"status":true,"listprice":158.50,"attr":"Tailless","itemid":"EST-14"},
{"code":"FL-DSH-01","name":"Manx","unitcost":12.00,"status":true,"listprice":83.50,"attr":"With tail","itemid":"EST-15"},
{"code":"FL-DLH-02","name":"Persian","unitcost":12.00,"status":true,"listprice":23.50,"attr":"Adult Female","itemid":"EST-16"},
{"code":"FL-DLH-02","name":"Persian","unitcost":12.00,"status":true,"listprice":89.50,"attr":"Adult Male","itemid":"EST-17"},
{"code":"AV-CB-01","name":"Amazon Parrot","unitcost":92.00,"status":true,"listprice":63.50,"attr":"Adult Male","itemid":"EST-18"}
];
}
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!