Salesforce Life Balance

Visualforce - Beyond Basics Series 41 - Dynamic Forms

Issue with Standard Forms in Salesforce ?

In Standard record Edit Page, there's no way we can hide/show a set of Fields for Users to Fill In. This is the big issue when you have hundreds of fields that gets presented to the User.

How to solve with visualforce Page ?

In visualforce page, this problem can be solved by showing/hiding different sections based on the 'certain value' in Fields (or) certain User Action.

Where is the Code ?

Any Screenshots ?

Walk through in a video ?

Visualforce - Beyond Basics Series 40 - Static Resource is not the only one

Where do you normally store resources in Salesforce ?

As a developer, we know that most of the resources for projects like images(icons, labels, loaders), javascript, css files is Static Resource. But, there are few different areas in salesforce we could leverage.

What are the specific purposes for different areas ?

These are the different areas where you could store resource & use them in your visualforce page.

Static Resource

Like the name suggests, one should store the resources that is a static one which doesn't change over the course of time. So, all images, css/js files which has a very stable version should be stored in it.

Tips :

1. One tip is that Org should maintain a proper repository for their static resources & avoid duplicates among the resources. For example, i have seen jquery, loader images all over the static resource packages. This is very ineffective management for the storage space allocated for static resource.
2. Another tip is to not create package per projects. This will lead to contain duplicate resources. Rather than, better maintain static resource per resource like JS, CSS, LOGOS, LOADERS, etc.

Notes & Attachments

If the resource like Text Documents (rtf, msdoc, csv, pdf, css, js, etc), Images (jpeg, png, gif), videos (flv, avi, mp4, etc) are attached to any Standard/Custom objects like Account, Contact, etc, we could leverage that & use those in Visualforce Pages.

Example :

For example, recently, i have built a visualforce page that displays the product image for an account. I could have uploaded them in static resource. But, its specific to the Account, so i have added them to Notes and Attachments & used them in visualforce.

Documents

This is the storage area one should use when the resource is not associated to any Object. If it's a single file that is slightly large one, could easily fit in this area. One more advantage is that not only developers, admins can also share this space.

Chatter Files

This is the storage area shared between chatter users, admin & developers. But, one should use this space only if the visualforce page is related to chatter functionality. Otherwise, there's no guarentee that this resource will exisit, as any chatter/admin could modify/delete this resource.

Hosted External

This is the technique of storing the resources outside Salesforce. This is also a efficient method, as there are so many reliable systems out there today for each resources.
         Javascript  - Google hosted resources, JQuery, Angular, etc
         Images      - Github, Flickr, etc
         CSS          - Google hosted resources, Bootstrap, W3.CSS, etc
         doc           - Google docs, etc

Where is the Code ?

For illustration, i have shown the images from 'Static Resource', 'Notes and attachments' & Documents.

Any Screenshots ?

Walk through in a video ?

Technical Architect - Easy Guide - Series End

What is new in Technical Architect Certification ?

Salesforce decided to split CTA exam into different parts based on different vertical. To be honest, this is a very cool move, as no one can really master everything in Salesforce.
I know few CTA's who worked in only few areas, but still  managed to get CTA. This is totally unfair when salesforce claims this is the top level certification they have.

• Apex & Visualforce Architect
• Application Architect
• Communities Architect
• Identity Architect
• Deployment Architect
• Integration Architect
• Data & Access Architect
• Mobile Architect

How it's going to impact us ?

As a developer/admin, this is going to really affect us, if we are preparing for it over few months/years. If anyone passed Salesforce Multiple Exam before 31 Jan 2017 they can still apply for Technical Review board round. Otherwise, they need to meet the new requirements to appear for
Review board.

Preparation Guide ?

Salesforce has given a collection of free resources in the form of free ebook. 

Click here - Free ebook - Salesorce Technical Architect

What i have decided ?

Since, i love to Architect, Design & Code myself, i really don't want to just focus on one level of skills. Moreover, if someone want an Architect job from me, they may not expect any development work, So, i really don't want to get to that point. That's why i decided to get architect certification whichever involves more development work like 'Apex & Visualforce Architect', 'Integration Architect','Mobile Architect'

Any idea on career path ?

I would advice all my blog readers that there are multiple domains & levels of skills required to do any kind of work in salesforce. So, be stick with what you really love to do & get expert in that.

No more videos on CTA ?

So, i have decided to stop contributing to CTA, as it is getting very diverse & I'm going to share what i'm currently working on, like Lightning, Javascript, Apex, etc.

Walk through in a video ?

Visualforce - Beyond Basics Series 39 - Modern Upload Button

How to upload an attachment to record ?

Using apex:inputFile tag, we can upload a file & store that as the attachment to the record. The master record id should be assigned to parentId for the Attachment.

What is the traditional way ?

Traditionally, developers use the same styling of inputFile as it is. That means there will be an upload button for user to select the file & there has to be a commandButton/commandLink to call the action function.

How to transform that to modern look ?

But, in a modern Upload button solution, a Upload label will be styled as a Button. Then, the inputFile tag will be inside the label & hidden from user. So, user will see only Label(Button), not the acutal inputFile.

Where is the Code ?

Here's the code that illustrates the traditional method & more modern method to upload the file.

Any Screenshots ?

Walk through in a video ?

Technical Architect - Easy Guide - Series

Want to become a Certified Technical Architect (CTA) ?

I know that many Salesforce Developers & Admins want to pursue their career toward Architect role in Salesforce Platform. Though, they might have some experience, it's quite hard to get CTA. The main reasons are,

1.   Wide Knowledge
2.   Many points to remember
3.   Many subjective ideas/decisions
4.   Need of Communications skills
5.   Expensive & Time consuming
6.   Less Community Support

How i'm going to address these problem ?

      1) Wide Knowledge

Information are scattered around the web in Salesforce help manual, blogs, videos, webinars etc. I'm going to bring everything in one series of blog posts.

      2) Many points to remember

I'm going to present the information in more interested ways. So, it will be easy to digest & remember.

      3) Many subjective ideas/decisions

The information which has assumptions, considerations, limitations will be highlighted to give more readablity & clarity to the user.

      4) Need of Communications skills

There will be a section to improve communication specifically for Technical Architect role. So, going through them will help anyone master the skills.

      5) Expensive & Time consuming

I can guarentee that i will make sure that time taken by going this course will be the shortest compariing to other methods/resources. When you acheive the CTA is less possible attemtps, you will save a lot of money.

      6) Less Community Support

This basic intention of this blog is to give a collaboration support among CTA & those who want to achieve it.

How to follow this ?

I'm going to post series of topics in this blog & also in my youtube channel. So, either subscribe to my blog (or) youtube channel

Walk through in a video ?

Visualforce - Beyond Basics Series 38 - Show Custom Popup

How to show a popup ?

A popup dialog will be very useful in cases where an temporary information needs to be shown to the user for either user Input/Output.

How to load a  page in popup ?

There's no standard popup techniques in Visualforce. So, we need to create a custom Popup & load a visualforce page on that using window.open API method.

How to interact with popup & parent page ?

From the popup, its possible to interact with parent page in two ways,

1.   By manipulating parent DOM directly.
2.   By triggering events to parent body component

Where is the Code ?

I have illustrated the custom popup through  a parent page where we have a Text Field that will be populated when the user selects the account in the dialog box.

Any Screenshots ?

Parent Page

Custom Lookup Dialog box

After user selected,

Walk through in a video ?

Visualforce - Beyond Basics Series 37 - Let user know what is happening

How much patience user has ?

In the modern cloud systems, nearly most of the Applications are hosted in cloud, user started having variety of Applications to use for a particular task. So, the user experience is must. User has less patience these days, so we need to develop applications that treat them as their first class citizens.

What is the maximum time user can wait ?

As per standard, the maximum wait time for a response during UI interation is 1 sec. Though, it seems very low, it is possible to achieve this standard very easily.

Best practice to enhance user experience ?

There might be case where we can't respond back to the user within 1 sec slot. In that case, at least we must report the progress to the user in the form of Progress bar, Status Message or even a Loader image.

How to achieve that ?

Most of the time when the processing can't be responded with Progress value in the Screen, Loader image will be used. In visualforce, actionstatus is used for that purpose. It offers two ways of reporting status message,

1.   Start & Stop Text Message
2.   Start & Stop component

Where is the Code ?

I have seen many developers using startText & stopText attribute in action status to display the message. But, it's very rare to use the facet tag to provide the start & stop component that will be displayed when the action takes place. So, i have illustrated with an example, where it will show a loader image on Start & shows a success image at the Stop phase.

Any Screenshots ?

When the request sent,

After the response received,

Walk through in a video ?

Visualforce - Beyond Basics Series 36 - Action for Lookup Dialog

What is Lookup dialog ?

All parent relationship field which is of type lookup can be changed using the standard inputField tag on them.

How can we take action after the Lookup ?

When user selects some value for the parent relationship, we may need to take some action, perhaps a validation (or) confirmation action to the user.

Where it will be useful ?

We could use this for validation purposes or rendering different section of the page based on the value selected, etc.

Where is the Code ?

The code will illustrate how to take action after the lookup value changed & update different section of the page based on the new selected value.

Any Screenshots ?

When loaded

After lookup

After value changed

Walk through in a video ?

Visualforce - Beyond Basics Series 35 - Build own Dialog Box

What is dialog box ?

Dialog box is a container where a message is displayed to the user & they can either Accept or Cancel the message.

Is there a standard dialog box component ?

There's no standard component to achieve that. so, we need to build a custom one.

How normally developers achieve this ?

Normally developers would use some third party libraries like Jquery, backbone etc to get the dialog box for their use case. But, it's not necessary, as it is very simple to build one & reuse for all your projects.

What is my solution ?

I build a component to create the dialog box & it can be used by pages when they wish to display a message to the user.

Where is the Code ?

I have illustrated with a page including the dialogbox component that i have created. Dialogbox component will accept the message to be displayed & Ok/Cancel action that will be executed. And also it accepts the rerender list of ids for each Action. It's possible to do everything that we could do with a dialog box.

Any Screenshots ?

After clicking 'Show Dialogbox'

After clicking 'OK'

Walk through in a video ?