Salesforce Remoting & jQuery Drag/Drop Mash-up

Wednesday, February 27, 2013 by Aslam - The Alexendra
Hi All,
Today I am going to show you a good useful mash-up using jQuery Drag/Drop feature with Salesforce Remoting. I have created a simple application where user can see a Dashboard where all Un-Assigned tasks are shown on left side. All available contacts will be available on right side.
Now, user can drag any task from left side list and drop on right side, for any contact. Internally the Task will be assigned to that particular Contact. This is done internally using Salesforce Remoting.
This type of applications are very convenient to use and do the work smoothly.



You can test the application here.
http://labsprojects-developer-edition.ap1.force.com/TaskAssignmentDashboard

Here are few assumptions/points regarding above demo;

1) I have used Contacts to assign the Task but actually we must use Users
2) I have given demo for Tasks, but we can use this application for other useful things like Cases, Leads and Opportunity assignments
3) The demo actually will not update the records in database. I have commented actual database update because of demo purpose. You can only check the drag and drop and assignments.

Mail me if you need the code for above demo.

Your suggestions to improve this app , are always appreciated.

Thanks
Aslam Bari

Salesforce JQuery Mobile Demo

Tuesday, February 12, 2013 by Aslam - The Alexendra
Hi All,
Here I am going to show you a demo of jQuery Mobile development which is using Salesforce Sites. Its very easy and convinient to integrate both technologies which is natively compatible with your mobile. It comes with a very cool native look and feel UI, responsive UI themes and APIs. With couple of tags you can build up your site compatible with multiple devices.



Here is a working demo. I am showing contact list from salesforce. You can search contacts. You can click any contact to see the detail.
http://labsprojects-developer-edition.ap1.force.com/JQMContacts

Open web browser in your mobile phone and open the above url to see in action.

If you need source code for above, drop me an email: aslam.bari@gmail.com

Thanks
Aslam Bari

Salesforce Calendar Component - SFC

Wednesday, February 6, 2013 by Aslam - The Alexendra
Hi All,
Recently I had a requirement where a client wanted to show complete year calendar on page with following requirements.

1) We can pass any year to calendar and it must print the complete year (12 month) calendar
2) It must have provision to highlight the holidays
3) It must be printed or saved or emailed as PDF also

To achieve it, i first find the jQuery UI DatePicker best fit. But there is a issue with this approach. JS does not work properly when we do RenderAs pdf in vf pages. So, this approach will not work.
Then finally I come up with my own solution by making native salesforce approach -  SFC Component. Feature for this are as below:

1) We can pass the component year and month
2) We can pass the component holidays list as well


Here is the syntax how you can use this:

<c:SFC_MonthComponent month="7" year="2013"/>

Above syntax will print July, 2013 calendar

<c:SFC_MonthComponent month="7" year="2013" holidays="25,30"/>

Above syntax will print July, 2013 calendar. In addition it will also highlight the 25th and 30th of the month as holidays

You can download the code from here:
http://www.aslambari.com/salesforce_calendar.html

You can see the working demo here
http://labsprojects-developer-edition.ap1.force.com/FullYearCalendar?year=2013

You can change the year parameter from url to see the calendar for different years on the above demo. For demo purpose i have highlighted few dates as holidays (orange color).

In the code, i have used some styles for printing calendar like holidays highlight. You can simply change those style to match up your theme.


The above code is for version 1. As this is native vf/apex, you can simply use "renderAs=pdf" to get the output in PDF format.

In next version , here is my plan to enhance it with following features.

1) Different preset of themes for styling the calendar component
2) Give Event feature for clicking on any date. You can do different operations on that click of any date

As always, your suggestions are welcome to enhance this tool


Thanks
Aslam Bari