Apex Code Development You need to sign in to do that
Don't have an account?
Hermann Ouré Update button on my Heroku app not responding
Hello,
I have deployed a Node.js app to heroku but the "Update Contact Information Button" is not responding. When pressing the button, the contact in Salesforce should be updated. The app is based on the trailhead (Quick Start: Heroku Connect https://trailhead.salesforce.com/content/learn/projects/quickstart-heroku-connect) That I have updated to fit my requirement.
The integration with heroku connect was successful
But when I press the update button on the app nothing happens!
here are my codes:
server.js:
index.html:
package.json:
I have deployed a Node.js app to heroku but the "Update Contact Information Button" is not responding. When pressing the button, the contact in Salesforce should be updated. The app is based on the trailhead (Quick Start: Heroku Connect https://trailhead.salesforce.com/content/learn/projects/quickstart-heroku-connect) That I have updated to fit my requirement.
The integration with heroku connect was successful
But when I press the update button on the app nothing happens!
here are my codes:
server.js:
const express = require('express');
const bodyParser = require('body-parser');
const pg = require('pg');
const app = express();
app.set('port', process.env.PORT || 5000);
app.use(express.static('public'));
app.use(bodyParser.json());
app.post('/update', function(req, res) {
pg.connect(process.env.DATABASE_URL, function (err, conn, done) {
// watch for any connect issues
if (err) console.log(err);
conn.query(
'UPDATE salesforce.Contact SET Phone = $1, MobilePhone = $1 WHERE LOWER(FirstName) = LOWER($2) AND LOWER(LastName) = LOWER($3) AND LOWER(Email) = LOWER($4)',
[req.body.phone.trim(), req.body.firstName.trim(), req.body.lastName.trim(), req.body.email.trim()],
function(err, result) {
if (err != null || result.rowCount == 0) {
conn.query('INSERT INTO salesforce.Contact (Phone, MobilePhone, FirstName, LastName, Email) VALUES ($1, $2, $3, $4, $5)',
[req.body.phone.trim(), req.body.phone.trim(), req.body.firstName.trim(), req.body.lastName.trim(), req.body.email.trim()],
function(err, result) {
done();
if (err) {
res.status(400).json({error: err.message});
}
else {
// this will still cause jquery to display 'Record updated!'
// eventhough it was inserted
res.json(result);
}
});
}
else {
done();
res.json(result);
}
}
);
});
});
app.listen(app.get('port'), function () {
console.log('Express server listening on port ' + app.get('port'));
});
index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CRM AXG</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<style>
body {
padding-top: 60px;
}
</style>
<script>
$(function() {
$("#phoneChangerForm").submit(function(event) {
event.preventDefault();
var errorMessage = $("#errorMessage");
var error = $("#error");
error.hide();
$("#message").hide();
var firstName = $("#firstName").val();
var lastName = $("#lastName").val();
var email = $("#email").val();
var phone = $("#phone").val();
if (firstName.length == 0 || lastName.length == 0 || email.length == 0 || phone.length == 0) {
errorMessage.text("All of the fields are required.");
error.show();
}
else {
$.ajax({
url: event.target.action,
method: event.target.method,
data: JSON.stringify({
firstName: firstName,
lastName: lastName,
email: email,
phone: phone
}),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
$("#firstName").val("");
$("#lastName").val("");
$("#email").val("");
$("#phone").val("");
$("#messageMessage").text("Record updated!");
$("#message").show();
},
error: function(err) {
errorMessage.text(err.responseJSON.error);
error.show();
}
})
}
});
});
</script>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/">Contact Information</a>
</div>
</div>
</nav>
<div class="container">
<form id="phoneChangerForm" action="/update" method="post" style="width: 400px">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Contact Information</h3>
</div>
<div class="panel-body">
<div class="form-group">
<label for="firstName">First Name</label>
<input type="text" class="form-control" id="firstName" placeholder="For verification" required>
</div>
<div class="form-group">
<label for="lastName">Last Name</label>
<input type="text" class="form-control" id="lastName" placeholder="For verification" required>
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" class="form-control" id="email" placeholder="For verification" required>
</div>
<div class="form-group">
<label for="phone">Phone</label>
<input type="tel" class="form-control" id="phone" placeholder="New Phone Number" required>
</div>
</div>
<div class="panel-footer">
<div id="message" class="alert alert-info" role="alert" style="display: none;">
<span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
<span id="messageMessage"></span>
</div>
<div id="error" class="alert alert-danger" role="alert" style="display: none;">
<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
<span class="sr-only">Error:</span>
<span id="errorMessage"></span>
</div>
<button type="submit" class="btn btn-primary">Update Contact Information</button>
</div>
</div>
</form>
</div>
</body>
</html>
package.json:
{
"name": "heroku-crm-axg-app",
"version": "1.0.0",
"description": "",
"main": "server.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node server.js"
},
"repository": {
"type": "git",
"url": "git+https://github.com/hermy2/heroku-crm-axg-app.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/hermy2/heroku-crm-axg-app/issues"
},
"homepage": "https://github.com/hermy2/heroku-crm-axg-app#readme",
"dependencies": {
"app.json": "^1.3.0",
"body-parser": "^1.19.0",
"express": "^4.17.1",
"pg": "^8.3.3"
}
}
We have a dedicated team for Trailhead guidance & issues please report it here,
https://trailhead.salesforce.com/help?support=home#
https://trailhead.salesforce.com/help
So that our trailhead support engineers will look into it and get back to you.
I hope you find the above information is helpful. If it does, please mark as Best Answer to help others too.
Regards,
Salesforce Support.