Customer Service Dashboard in CRM 2015 using HTML5, JavaScript, JQuery, CSS, DOM & OData

Introduction:

I’m feeling really happy while writing this blog, because i have been too busy from last couple of months to write even a single blog. From now on, I’m hoping to keep this activity continued.

As u all know Microsoft Dynamics CRM dashboards are one of the best way to show collective information about CRM in single shot and its also the collections of view lists, charts and iFrames that can pull in things like website information that you can modify to show key performance indicators and other important data. Here’s an example of what a dashboard looks like:

Today i am going to show a Customer Service Dashboard using HTML5, JavaScript, JQuery, CSS, DOM and OData. Intention is only to learn how can we use HTML5, JavaScript, JQuery, CSS, DOM and OData in Dynamic CRM. 

Language Used:

HTML5, JavaScript, JQuery, CSS, ODATA

This blog is also helpful for all those CRM Folks who are interesting to know how HTML5, JS, DOM and Odata can provide intuitive UI to dynamic CRM either in Dashboard or in entity forms.

I have designed a Customer Service Dashboard that shows CRM Case Log in very intuitive way, Below are the few screenshots of the same with some of its exiting features for beginners:

Few of the exciting features of this dashboard are described below in brief:

• Dashboard will show Case Count based on its Source (Web, Email, Phone, Chat).
• Agent can directly create new case from dashboard itself,
• Agent would have Refresh option so that he can able to see changes made by other agents instantly,
• Agents can directly Delete cases from Dashboard itself.
• Agents can directly open the case by clicking on Case Title.
• Agents can also check Ticket No or Case ID by doing hover on Case Title.

Features Used:

Feature 1 : Show Loading Message and Image unless OData Query retrieve the result from CRM.

:

Feature 2 : Call Center Agent Can directly Create new case in CRM by clicking on "+" icon.

Feature 3 : Call Center Agent will be able to see all cases of CRM status wise based on its Source like WEB, EMAIL, PHONE and CHAT.

Also agent would have Paging option so that he can be able to see only 5 case in single page, he has to navigate to next page to check other case status

Feature 4 : Call Center Agent will be able to see Ticket number on Hover of Case Title.

Feature 5 : Call Center Agent can directly delete the Case after clicking on OK in Cinformation dialog,

And after clicking on Refresh button he can check the required changes

Feature 6 : Call Center Agent will be able to see all the cases Source wise simultaneously.

Feature 7 : Call Center Agent can directly open the case by clicking on Case Title.

I will surely come back with other such new exciting task in CRM...Keep reading...

Also feel free to put your valuable comments to share your feedback and get to know more about this task.

OR

Email Me: arpit.crmconsultant@gmail.com