This is the first in a series of articles on how to send information from Salesforce.com (SFDC) to eProject.  In this example, we’ll use a simple eProject Dynamic Application (DA) web form to create a SFDC S-control for creating a new eProject record from SFDC data.

Note: The bulk of this work takes place in SFDC, so implementing this kind of integration requires experience with SFDC administration, particularly with S-Controls, and HTML formatting skills.

Getting Started

For this example, I’ll use an RFP request Dynamic Application for a professional services organization.  The workflow is that when a services RFP is requested as part of a sales opportunity, the Sales Executive will generate a new RFP request in SFDC by clicking a custom link on the SFDC Opportunity record.  This will load the DA webform in SFDC and pre-populate it with key data from SFDC, eliminating duplicate data entry and ensuring data consistency between the systems.

I’ve included screenshots illustrating this process.  Click the inline thumbnails to view the full-size screenshot.

Step 1: Create the Dynamic Application

Here is the DA, already created in eProject, with some sample data to demonstrate the field types:

Step 2:  Create the Web Form

From within the project where you wish to manage the data, select Configure Web Form from the DA menu.  Check the Enable Web Form checkbox, select the fields you wish to collect, and set your success/fail redirects:

Click Save and Generate HTML, then copy the code to a blank text file:

You don’t need to save the text file as an HTML file.  You just need to capture the form code so you can move it over to SFDC.

Step 3: Create the S-Control

In the SFDC Setup area, click Build -> Custom S-Controls, then click the New Custom S-Control button to begin.  Give the S-Control an appropriate Label, Name, and Description.  Set the Type to HTML, and then paste the web form code into the Content field:

Click Save, and you’re now ready to associate the S-control with a custom link

Step 4: Create the Custom Link

Navigate to Customize -> Opportunities -> Buttons and Links and click New in the Custom Buttons and Links section.  Give the link an appropriate Label, Name and Description.  Select the Detail Page Link, or you may choose to create a button if you wish.  The end result will be the same.  Select the desired link behavior (for this example, we’ll show it in the existing SFDC window), select Custom S-Control as the content source, and then select the correct S-control:

Click Save, and click OK to clear the page layout notification, and you’re almost ready to test your new S-Control.

Note: Although you can create the webform directly in the link definition, I prefer to use an S-Control, which can then be reused elsewhere in SFDC, and it makes it much easier to “upgrade” the link by simply swapping out the S-Control and not having to rewrite the live link code.

Step 5:  Add the Custom Link to the Page Layout

Navigate to Customize -> Opportunities -> Page Layouts, and Edit the layout where you want to add the link.  Drag the new link to the Custom Links section and Save the changes.

Step 6: Test the Link

Open an Opportunity and verify the new link appears under the Custom Links section:

Click the link, and the webform is displayed in SFDC:

Complete the fields:

Click Send.  The redirect is displayed:

Return to eProject and verify the record is created:

Step 7: Auto-populating the Form with SFDC Data

Return to SFDC and edit the S-Control.   You can use the SFDC Merge Fields to insert data from the Opportunity into the DA form and save your users some data entry.

Note: This part can be a little tricky and it’s recommended that someone who is comfortable working with HTML forms make these modifications.  The default webform code won't be the prettiest example of HTML code you've ever seen, but it's far from the worst.  Before I get started with this portion of the process, I like to put line breaks between the table rows to make it a easier to locate the form field I want to work with.

Scroll down the web form code and locate the <table> tag, it will be near the bottom of the code:

To auto-populate the Account Executive field, position the edit cursor between the apostrophes for the value attribute:

Select Opportunity from the Select Field Type dropdown, and then select Owner Full Name from the Insert Field dropdown, which adds the Merge Field code into the input tag as default value:

Repeat to insert other Merge Fields as appropriate.  For the Description field, which is a long text field, simply insert the Merge Field between the opening and closing <textarea> tags:

Save your edits and re-test the link:

Looks pretty good!  All of the fields here have been automatically populated by either Opportunity or Account data, and the user has the opportunity to add comments or clarifications in the Description field before submitting it.

In this example, I modified the form formatting a bit by reducing the columns in the Description text area to prevent horizontal scrolling, and I got rid of the date format caption for the RFP Due Date field.  You can also format the fonts, colors, and other aspects of the webform to match your standard stylesheet, branding, or even just make it look a little more like an SFDC page.

In Part 2, I’ll show you how to use a webform-driven S-Control bypass the eProject webform and validation altogether and automatically submit data from SFDC to eProject.