Below is the form structure that integrates AngularJS and Ionic:
<ion-modal-view class="game" ng-controller="PdfsmtpCtrl">
<ion-header-bar class="bar bar-balanced">
<a class="button button-icon icon ion-close-circled" ng-click="hideInformation()"></a>
<h1 class="title">PDF-Export per Email</h1>
<a type="submit" ng-click="getPdf(user)" class="button button-icon icon ion-checkmark-circled"></a>
</ion-header-bar>
<ion-content scroll="false" class="game">
<div>
<form novalidate class="simple-form">
<label>E-mail: <input type="email" ng-model="user.email" /></label><br />
<input type="submit" ng-click="getPdf(user)" value="Save" />
</form>
</div>
</ion-content>
</ion-modal-view>
UPDATE: Here are the details of the AngularJS functions in use:
'use strict';
angular.module('app')
.controller('PdfsmtpCtrl', function ($scope, Pdfsmtp)
{
$scope.pdfsmtp = new Pdfsmtp();
$scope.hideInformation = function ()
{
$scope.pdfsmtpModal.hide();
};
//joey: PDF to generate
$scope.getPdf = function (user)
{
var user = angular.copy(user);
var emailReceiver = user.email;
var emailSubject = "<SubjectText>";
var emailBody = "<BodyText>";
var emailSender = "<EmailAddress>";
var fileName = "<FileName.pdf>";
var hostName = "<SenderHostName>";
var contentType = "application/pdf";
var doc = new jsPDF
({
orientation: 'p',
unit: 'mm',
format: [210, 297],
});
//joey: Simon Bengtsson and his autotable
doc.setFontSize(22);
doc.setTextColor(23, 154, 85);
doc.text(("<SomeText>"), 14, 15);
doc.autoTable(
{
startY: 30,
startX: 30,
headStyles: {fillColor: [25, 141, 79] },
footStyles: {fillColor: [25, 141, 79] },
theme: 'grid',
styles:
{
overflow: 'linebreak',
lineWidth: 0.5,
lineColor: [25, 141, 79]
},
html: '#resultTable',
});
var finalY = doc.lastAutoTable.finalY || 20;
doc.setTextColor(23, 154, 85);
doc.text('Table: Signature:', 14, finalY + 20);
var blob = doc.output();
var dataUri = "data:" + contentType + ";base64," + btoa(blob);
Email.send(
{
Host: hostName,
Username: emailSender,
Password: "<somepassword>",
To: emailReceiver,
Attachments :
[{
name : fileName,
data : dataUri
}],
From: emailSender,
Subject: emailSubject,
Body: emailBody
}).then($scope.hideInformation());
}
});
Upon clicking Save in the form, everything works smoothly as the user variable is passed along to the respective function.
However, upon clicking the submit icon in <ion-header-bar>, an error is encountered stating that the user variable is undefined:
TypeError: Cannot read property 'email' of undefined
To rectify this issue and be able to utilize the Submit functionality, what steps need to be taken?