Hi readers, here I am going to show you an example of How to Post Form Data to Salesforce using Node.Js and Angular Js.
How to Post Form Data to Salesforce using Node.Js and Angular Js:
We are familiar with Jsforce module in Node.Js from our previous session. Here I will show you how can we Post Form Data to Salesforce using Node.Js and Angular Js.
Let’s start the example.
Application Setup:
For this example I am going to create a directory called NodeJsPostDemo. After creating the directory Move to the directory location using the following commands
mkdir NodeJsPostDemo
cd NodeJsPostDemo
Now we need to create application using the following command.
npm init
This will ask you a series of questions. Here are the answers I gave to the prompts.
Our application has a dependency of Express.js module. We need to install express in order for this to work properly. Go to command prompt and install Express.js module using the following command.
npm install express --save
To parse the data in the body we will need to add middleware into our application to provide this functionality. We will be using the body-parser module. We need to install it, so in your terminal window enter the following command.
npm install body-parser --save
Now we need to create a file called index.js that will contain the code for our Node.Js server. Here is the code for index.js file.
var express = require("express");
var app = express();
var port = 8080;
var bodyParser = require('body-parser')
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: true }))
app.get("/", (req, res) => {
res.sendFile(__dirname+"/views/index.html");
});
app.post("/SaveBookDetails", (req, res) => {
console.log(req.body);
});
app.listen(port, () => {
console.log("Server listening on port "+port);
});To test the application goto command prompt and run the following command.
Node Index.js
Now to open browser and navigate to following url.
http://localhost:8080/
Posting Data to and Reading Data From Salesforce:
First of all we need to create an HTML page that will allow user to post record to salesforce. Create a folder in your application folder called views and then create a HTML file called Index.html. Write the following markup in index.html file.
<html>
<head>
<link
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div id="wrapper" ng-app="nodeapp" ng-controller="nodectrl">
<!-- Navigation -->
<div id="page-wrapper" style="padding:20px">
<divclass="row">
<divclass="col-lg-12">
<h1>
Post Form Data to Salesforce using Node.Js
</h1>
</div>
</div>
<br/>
<div class="row">
<div class="col-md-2">
<label>
Book Name
</label>
</div>
<div class="col-md-3">
<input type="text" class="form-control" id="txtName" ng-model="BookName"/>
</div>
<div class="col-md-2">
<label>
Price
</label>
</div>
<div class="col-md-3">
<input type="text" class="form-control" ng-model="Price" id="txtPrice"/>
</div>
<div class="col-md-2">
<input type="button" ng-click="OnSaveBookDetails();" value="Save" class="btn btn-primary" id="btnSave">
</div>
</div>
<br/>
<div class="row">
<div class="col-md-12">
<h2>
Book Records
</h2>
</div>
</div>
<br/>
<div class="row">
<div class="col-md-12">
<table class="table table-hover">
<thead>
<tr>
<th>Name</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<trng-repeat="item in vBookData">
<td>
{{item.Name}}
</td>
<td>
{{item.Price__c}}
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var app = angular.module('nodeapp', []);
app.controller('nodectrl', function ($scope,$window, $http) {
$scope.vBookData=[];
$scope.OnSaveBookDetails = function ($event) {
varBookData = { Name:$scope.BookName, Price__c:$scope.Price };
alert(BookData);
varresp = $http({
method: "post",
url: "/SaveBookDetails",
data: BookData
});
resp.then(function (res) {
varvItem={id:res.data,Name:$scope.BookName,Price__c:$scope.Price};
varvData=$scope.vBookData;
vData.push(vItem);
$scope.vBookData=vData;
}, function (err) {
});
}
$window.onload =function()
{
varresp = $http({
method: "get",
url: "/GetBookRecord",
data: null
});
resp.then(function (res) {
$scope.vBookData=res.data;
}, function (err) {
});
}
});
</script>
</body>
</html>app.get("/", (req, res) => {
res.sendFile(__dirname+"/views/index.html");
});verify your changes on the browser.
Now we need to configure our app to implement salesforce module. Run the following command to use jsforce module.
npm install jsforce --save
Here is the complete code for index.js.
var express = require("express");
var app = express();
var jsforce = require('jsforce');
var conn = new jsforce.Connection({
// you can change loginUrl to connect to sandbox or prerelease env.
// loginUrl : 'https://login.salesforce.com'
});
var port = 8080;
var bodyParser = require('body-parser')
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: true }))
app.get("/", (req, res) => {
res.sendFile(__dirname+"/views/index.html");
});
app.post("/SaveBookDetails", (req, res) => {
varvData=req.body;
conn.login("Your-Salesforce-User-Name", "Your-Salesforce-Password+SecurityToken", function(err, userInfo) {
if (err) { returnconsole.error(err); }
// Now you can get the access token and instance URL information.
// Save them to establish connection next time.
conn.sobject("Book__c").create(vData, function(err, ret) {
if (err||!ret.success) { returnconsole.error(err, ret); }
res.send(ret.id);
console.log("Created record id : "+ret.id);
// ...
});
});
});
app.get("/GetBookRecord",(req,res)=>{
conn.login("Your-Salesforce-User-Name", "Your-Salesforce-Password+SecurityToken", function(err, userInfo) {
if (err) { returnconsole.error(err); }
// Now you can get the access token and instance URL information.
// Save them to establish connection next time.
console.log("Get")
conn.query("SELECT Id, Name,Price__c FROM Book__c", function(err, result) {
if (err) { returnconsole.error(err); }
res.send(result.records);
});
});
});
app.listen(port, () => {
console.log("Server listening on port "+port);
});Node index.js
Output:
View More:
- Interacting Salesforce into a Node.Js application using Jsforce library.
- Forms in Node.Js.
- Callbacks in Node.JS.
- Hello World Example in Node.JS.
Conclusion:
I hope you understand how to Post Form Data to Salesforce using Node.Js and Angular.Js. Your feedback and suggestions are always welcome to me.
Thank You.