One detail that we founded in the impelementation of DataTables and Editor
We fortgot to tell you some particular ways to implement
1) In the index.html in the Ionic framework, we putted all the script librarys that call or make refernce to the datattables and edior and in the ts component class works as we indicated in the above aswer
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, Config } from 'ionic-angular';
/**
* Generated class for the AerolineaPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-aerolinea',
templateUrl: 'aerolinea.html',
})
export class AerolineaPage {
...
onInitEditor() {
//set DataTable...
this.table = $(this.tableId);
//instance Editor...
this.editor = new this.table.DataTable.Editor({
ajax: this.getRestAjaxAerolinea(),
table: this.tableId,
fields: this.getFields(),
template: '#form-informe'
});
}
...
}
2) We remove from index.thml in the Ionic framewor all script librarys and we begun to call reference with de 'import' word, and this type of call to the editor doesn't work as we menttioned before
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import $ from 'jquery'; //works
import 'datatables.net'; //works
import 'datatables.net-editor' //-> this line trigger "jQuery is not defined"
/**
* Generated class for the AerolineaPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-aerolinea',
templateUrl: 'aerolinea.html',
})
export class AerolineaPage {
.
.
.
}
We are advancing in our projet with nodejs and editor...
Just one more question... in reference to uploadfiles. It tokes some time to resolve delete files. In the interface you putt a button with X to remove files, but it is not attach a event that we can controlled remove each one file.
To resolve this inconvenent, we putted in the event of field upload a event that can controll it. To resume this the little code
//every time we upload always set a evento to attach to button X to remove file
$(editor.field('fiels').input()).on('upload.editor', function(e, val) {
$('button.remove').click((e)=> {
let id = $(e.currentTarget).closest('li').find('a').attr('data-value');
//continue with the code to delete a file by id
});
})
We made this kind of code because the event dessapear every time that one file is uploaded, and we need to set again the event for that not dessapear.
The cuestion is, It's correct that we are making?, can you put a event directly to the button X to remove file?
One detail that we founded in the impelementation of DataTables and Editor
We fortgot to tell you some particular ways to implement
1) In the index.html in the Ionic framework, we putted all the script librarys that call or make refernce to the datattables and edior and in the ts component class works as we indicated in the above aswer
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, Config } from 'ionic-angular';
/**
* Generated class for the AerolineaPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-aerolinea',
templateUrl: 'aerolinea.html',
})
export class AerolineaPage {
private editor: any;
private table: any;
private oTable: any;
constructor(public navCtrl: NavController,
public navParams: NavParams,
public config:Config) {
}
private getColumns() {
return [
{
title: 'Name',
data: 'aer_name'
}
]
};
onInitEventsDt() {
this.oTable.on('click', 'tr', (e) => {
let data = this.oTable.row(e.currentTarget).data();
console.log(data);
});
}
ionViewDidLoad() {
this.table = $('#tAerolinea');
this.oTable = this.table.DataTable({
ajax: 'http://dirserver/aerolinea/list',
select: true,
columns: this.getColumns()
});
//init events Dt...
this.onInitEventsDt();
}
}
2) We remove from index.thml in the Ionic framewor all script librarys and we begun to call reference with de 'import' word, and this type of call to the editor doesn't work as we menttioned before
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import $ from 'jquery'; //works
import 'datatables.net'; //works
import 'datatables.net-editor' //-> this line trigger "jQuery is not defined"
/**
* Generated class for the AerolineaPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-aerolinea',
templateUrl: 'aerolinea.html',
})
export class AerolineaPage {
.
.
.
}
One detail that we founded in the impelementation of DataTables and Editor
We fortgot to tell you some particular ways to implement
1) In the index.html in the Ionic framework, we putted all the script librarys that call or make refernce to the datattables and edior and in the ts component class works as we indicated in the above aswer
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, Config } from 'ionic-angular';
/**
* Generated class for the AerolineaPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-aerolinea',
templateUrl: 'aerolinea.html',
})
export class AerolineaPage {
private editor: any;
private table: any;
private oTable: any;
constructor(public navCtrl: NavController,
public navParams: NavParams,
public config:Config) {
}
private getColumns() {
return [
{
title: 'Name',
data: 'aer_name'
}
]
};
onInitEventsDt() {
this.oTable.on('click', 'tr', (e) => {
let data = this.oTable.row(e.currentTarget).data();
console.log(data);
});
}
ionViewDidLoad() {
this.table = $('#tAerolinea');
this.oTable = this.table.DataTable({
ajax: 'http://dirserver/aerolinea/list',
select: true,
columns: this.getColumns()
});
//init events Dt...
this.onInitEventsDt();
}
}
2) We remove from index.thml in the Ionic framewor all script librarys and we begun to call reference with de 'import' word, and this type of call to the editor doesn't work as we menttioned before
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import $ from 'jquery'; //works
import 'datatables.net'; //works
import 'datatables.net-editor' //-> this line trigger "jQuery is not defined"
/**
* Generated class for the AerolineaPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-aerolinea',
templateUrl: 'aerolinea.html',
})
export class AerolineaPage {
.
.
.
}
Sorry for late answer. We are continue development our project as we mentioned to you, through call all js librarys in the index.html page and not through ts import class.
We hope, that we put a test app in the web and that you could helpus.
Answers
Allan
One detail that we founded in the impelementation of DataTables and Editor
We fortgot to tell you some particular ways to implement
1) In the index.html in the Ionic framework, we putted all the script librarys that call or make refernce to the datattables and edior and in the ts component class works as we indicated in the above aswer
TS class
2) We remove from index.thml in the Ionic framewor all script librarys and we begun to call reference with de 'import' word, and this type of call to the editor doesn't work as we menttioned before
Any import of editor causes error
Please, give us your help, thanks
Regards
Thanks Allan
We are advancing in our projet with nodejs and editor...
Just one more question... in reference to uploadfiles. It tokes some time to resolve delete files. In the interface you putt a button with X to remove files, but it is not attach a event that we can controlled remove each one file.
To resolve this inconvenent, we putted in the event of field upload a event that can controll it. To resume this the little code
We made this kind of code because the event dessapear every time that one file is uploaded, and we need to set again the event for that not dessapear.
The cuestion is, It's correct that we are making?, can you put a event directly to the button X to remove file?
Thanks for your support
Regards
Allan
One detail that we founded in the impelementation of DataTables and Editor
We fortgot to tell you some particular ways to implement
1) In the index.html in the Ionic framework, we putted all the script librarys that call or make refernce to the datattables and edior and in the ts component class works as we indicated in the above aswer
TS class
2) We remove from index.thml in the Ionic framewor all script librarys and we begun to call reference with de 'import' word, and this type of call to the editor doesn't work as we menttioned before
Any import of editor causes error
Please, give us your help, thanks
Regards
Allan
One detail that we founded in the impelementation of DataTables and Editor
We fortgot to tell you some particular ways to implement
1) In the index.html in the Ionic framework, we putted all the script librarys that call or make refernce to the datattables and edior and in the ts component class works as we indicated in the above aswer
TS class
2) We remove from index.thml in the Ionic framewor all script librarys and we begun to call reference with de 'import' word, and this type of call to the editor doesn't work as we menttioned before
Any import of editor causes error
Please, give us your help, thanks
Regards
Yes sorry about that. Not sure why, but your post was caught by the spam filter. I've marked your account so that won't happen again.
The error you are seeing suggests that the UMD is falling through to the browser loader:
Could you confirm if that is where the code is breaking?
Allan
Allan
Sorry for late answer
We made a trace of editor code and found that break into line 1382
dataTables.editor.js
and into trace of ionic ion-dev file trigger the error: "jQuery is not defined"
Thanks for your help
Regards
I didn't really expect it to break on that line. Can you give me a link to your page / app so I can try debugging it please?
Allan
Allan
Sorry for late answer. We are continue development our project as we mentioned to you, through call all js librarys in the index.html page and not through ts import class.
We hope, that we put a test app in the web and that you could helpus.
Thanks