Bootstrapping the PHP Toolkit – Part 2

Img80_phpIn the last tutorial, I described how I used jQuery DataTable and Bootstrap to revamp the Contact list. In this part, I will describe on how to build simple Contact Detail pages and how to create, update and delete Contact records to enhance the toolkit further.

Just to do a quick refresh, we made the Contact Id linkable in the list view and this is how the list view looked like in our previous tutorial.

Screen Shot 2016-06-04 at 11.42.44 AM

There are a couple of ways to fetch data for the detail page.

A) Either you get the Id and few fields for the list view for initial rendering in the list view

B) Or you get all the fields that you need for list and detail view and hide the ones that are not needed

For this particular tutorial, I chose the approach B) and here’s what the detail view looks like.

Screen Shot 2016-06-04 at 1.07.49 PM

And now let’s take a quick look at the underlying code.

First, we fire a SOQL query to retrieve all the fields that we need to display for the Contact object and we store it in an array as shown below

Screen Shot 2016-06-04 at 1.09.12 PM

And then for the rendering, depending on whether we’re in the list view or the detail view, we hide the fields that are not required.

Screen Shot 2016-06-04 at 1.10.42 PM

Now, let’s look at the create and edit functionality.  The logic to create/ update records is simple – once the form is filled out, we check if the record id already exists, we do an update operation. If it does not exist (new record), we do a create operation.

Clicking the + button on top right opens up the new Contact form for creation

Screen Shot 2016-06-04 at 1.14.35 PM

Similarly, clicking the ‘Edit’ button on a detail record for any Contact opens it up for editing.

Screen Shot 2016-06-04 at 1.15.46 PM

Read the values from the form and do a create/ update operation based on the record id value.

Screen Shot 2016-06-04 at 1.19.09 PM

Clicking the ‘Delete’ button on the detail view will delete the record locally as well as from Salesforce backend.

Screen Shot 2016-06-04 at 1.21.29 PM

If there are any errors in deleting the record, an alert is shown appropriately.

And that’s it! We’ve now improved the PHP Toolkit and built a detail page, understood how to create a new record, how to update a record and how to delete a record!

The source code is available here (updated with bug fixes).

In the next and concluding part of this series, we’ll look at how do do import and export Contacts into CSV to facilitate bulk operations.

See you soon!


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s