Hi there, I’m trying to save my form data to the local storage of the app as the app has a couple of forms. SO basically what I want is the form is to be filled in two sections sec 1 and sec 2, user can fill sec 1 save it and edit it also I want the data to be there once filled and then proceed to sec 2 at the same time or may be weeks later and do the same. After the final submission(no editing can be done on forms and the data would clear out) form data of both the section would be exported on a PDF file.(Here I used the PDF code just to check if data is being printed or not.)
I tried doing that but I didn’t get the desired result _**
whenever I fill the form and serve the app the data gets lost
can anyone help me with my code…
export class SecOnePage {
schoolName: any;
addRess: any;
direcTion: any;
mapLoc: any;
schoolType: any;
typeSchool: any;
headOrg: any;
contSchool: any;
sec1={
SchoolName: '',
Address: '',
Direction:'',
MapLoc:'',
SchoolType:'',
TypeSchool:'',
HeadOrg:'',
ContSchool:'',
}
pdfObj = null;
constructor(public navCtrl: NavController, public navParams: NavParams, public loadingCtrl: LoadingController, private platform: Platform, private file: File, private fileOpener: FileOpener) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad SecOnePage');
if (localStorage.getItem('stat') == '0') {
var sec1 = JSON.parse(localStorage.getItem("sec1"));
this.schoolName = sec1.SchoolName;
this.addRess = sec1.Address;
this.direcTion = sec1.Direction;
this.mapLoc = sec1.MapLoc;
this.schoolType = sec1.SchoolType;
this.typeSchool = sec1.TypeSchool;
this.headOrg = sec1.HeadOrg;
this.contSchool = sec1.ContSchool;
}
}
saveSecI() {
localStorage.setItem('stat', '0');
var sec1 = [
{
"SchoolName": this.schoolName
},
{
"Address": this.addRess
},
{
"Direction": this.direcTion
},
{
"MapLoc": this.mapLoc
},
{
"SchoolType": this.schoolType
},
{
"TypeSchool": this.typeSchool
},
{
"HeadOrg": this.headOrg
},
{
"ContSchool": this.contSchool
}
];
// Or to get a key/value pair
localStorage.setItem("sec1", JSON.stringify(sec1));
// sec1 = JSON.parse(localStorage.getItem("sec1"));
}
gotoSecII(){
// console.log(sec1);
var docDefinition = {
content: [
{ text: this.schoolName, style: 'story', margin: [0, 20, 0, 20] },
{ text: this.addRess, style: 'story', margin: [0, 20, 0, 20] },
{ text: this.direcTion, style: 'story', margin: [0, 20, 0, 20] },
{ text: this.mapLoc, style: 'story', margin: [0, 20, 0, 20] },
{ text: this.schoolType, style: 'story', margin: [0, 20, 0, 20] },
{ text: this.typeSchool, style: 'story', margin: [0, 20, 0, 20] },
{ text: this.headOrg, style: 'story', margin: [0, 20, 0, 20] },
{ text: this.contSchool, style: 'story', margin: [0, 20, 0, 20] },
],
styles: {
story: {
italic: true,
alignment: 'center',
width: '50%',
}
}
}
this.pdfObj = pdfMake.createPdf(docDefinition);
if (this.platform.is('cordova')) {
this.pdfObj.getBuffer((buffer) => {
var blob = new Blob([buffer], { type: 'application/pdf' });
// Save the PDF to the data Directory of our App
this.file.writeFile(this.file.dataDirectory, 'myletter.pdf', blob, { replace: true }).then(fileEntry => {
// Open the PDf with the correct OS tools
this.fileOpener.open(this.file.dataDirectory + 'myletter.pdf', 'application/pdf');
})
});
} else {
// On a browser simply use download!
this.pdfObj.download();
// }
let loading = this.loadingCtrl.create({
content: 'Please wait...'
});
loading.present();
loading.dismiss();
this.navCtrl.push(SecTwoPage);
}
}
}
