Archive

Archive for the ‘Visualforce’ Category

Seattle Force.com Developer Meeting

March 31st, 2010 No comments

There is a another force.com developer meeting for Seattle coming up this Thursday. If you are in the Seattle area and want to meetup or learn more about developing on the force.com platform please stop by.

Just a friendly reminder that this Thursday, April 1st at 4:00pm will be the our monthly meeting.

The meetings as always will be held in the West Monroe Partners office located at:

1215 4th Ave, Suite 1010
Seattle, WA 98161

This session will be an open forum so bring any questions, problems, and/or issues you have so we can discuss with the group.

If you have something cool you’d like to show off or present let me know and we can arrange for you to speak at one of the upcoming sessions.

Serious Performance Issues with New Salesforce UI CSS

March 24th, 2010 5 comments

To be honest I sort of feel bad about writing this post. I have already reviewed, ranted about, and tweaked the new salesforce.com UI, but here comes my third consecutive post related to this. I promise my next post will be about something super cool and radtaculous you can do with salesforce!

We hoped to enable the new UI in the next few weeks and like any good admin or developer I checked all of our custom Visualforce pages to make sure everything still looked and worked correctly. Everything started out so smooth. Everything was looking good. My basic, and for the most part, static Visualforce pages seem to work fine.

Read more…

Improve the New Salesforce UI with Greasemonkey

March 17th, 2010 8 comments

In my last post (you can read it here) I was ranting like an angry hippopotamus about the new salesforce.com UI released with Spring 10 and what I think it should look like. This follow up post will show you how to make the changes I proposed in that post a reality.

Before we work the magic and make the new UI even better I want to expand on some of my thoughts regarding the new UI. Some may say it is “change” and change is hard, you just need to get used to it. Not true. Change should never be hard. Change should be something better. It should be a measurable improvement over the previous version. A perfect example of this was the recent redesign of cnn.com. This was a massive improvement and nearly everyone everyone applauded the changes. Change was easy because it made our user experience better. I don’t hate the new salesforce UI. I don’t even not like it. There is just something about it that doesn’t feel right. I can’t place my finger on it but I think the changes I’ve made below will make a huge improvement. Blah blah blah, enough pointless blabbering, let’s get to the good stuff.

Since the original post I have had some time to get comfortable with the new UI and several of the changes I initially proposed probably aren’t needed.  My first stab at changing the UI was also a bit bold, too bold. I took my changes of the UI to the extreme to really emphasize the direction I think the new UI needs to move. In reality the changes needed are much softer. What it came down to in the end was eliminating the massive amount of white space in the record detail section and bringing back the old style page block section separators. So how do we do this? Greasemonkey to the rescue!!!!

The first ingredient of awesomesauce is to install the Greasemonkey plugin for the Firefox browser. You can download that here. Greasemonkey allows you customize websites with fancy pants JavaScript.


Read more…

Categories: Technology, Visualforce

The New Salesforce UI Should Look Like This

March 11th, 2010 19 comments

UPDATE: See the follow up post here: Improve the New Salesforce UI with Greasemonkey

The new salesforce.com UI has been rolled out to all instances as of March 6th and the feedback is starting to roll in. Based on the feedback I have heard, direct and indirect, is that there appears to be four groups of people. A few people that love it, a few people that like it, a lot of people that are undecided, and a lot of people that don’t like it. This is probably not the distribution of feedback salesforce was hoping for.

Read more…

Categories: Technology, Visualforce

Seattle Force.com Developer Group

March 3rd, 2010 No comments

Heads up that if you are a Force.com/Salesforce developer or want to learn more about force.com development in the Seattle area there is a meeting this Thursday, the 4th.

The meetings as always will be held in the West Monroe Partners office located at:

1215 4th Ave, Suite 1010

Seattle, WA 98161

When:  Thursday, March 4th, 2010

Start Time: 4:00 PM

This session will be an open forum so bring any questions, problems, and/or issues you have so we can discuss with the group. If we finish early, we can maybe grab a beer at one of the local bars downtown.

If you are interested even a little please stop by.

Categories: Apex, Technology, Visualforce

Add Slider to a Visualforce Page with jQuery

February 16th, 2010 18 comments

A while back Jeff Douglas posted on his blog how to embed a Flex slider into a visualforce page. This is pretty slick and can be really useful, but I’m not a really a fan of Flex (I’ll post about that later) so today let’s look at doing the same thing a little different.

Instead of using Flex to build the slider I will show you how to do this with javascript. This requires less code and I feel it is easier to implement.

We are going to add a super nifty ultra slick slider with only 16 lines of javascript code.

Read more…

Categories: jQuery, Visualforce

Setting up jQuery with salesforce.com

February 3rd, 2010 33 comments

My posts have been lacking lately but in the next few weeks I plan on creating some super slick demos that mix jQuery and Force.com into a delicious concoction of wonderfulness. Before I do this I’d like to go over the basics of setting up jQuery to play nice with Force.com (or salesforce.com, all the same).

If all we need is jQuery, the first thing we need to do is download it here here: http://jquery.com/.

There will be two versions, one is considered production and the other development. These actually contain the same code but the production file removes all unnecessary spaces.

mr-t_bigger

This smaller version allows the script to be downloaded quicker by users viewing the page and will provide a better user experience to those with less bandwidth.
Read more…

If Visualforce Blows, This Sucks

January 11th, 2010 58 comments

I recently saw a tweet that included nothing but a link and a lot of salesforce.com related tags.

Visual Force Blows (link was shortened in original tweet so I couldn’t see title)

What could this be I pondered? A new product announcement? A glowing review of the force.com platform? Upon clicking the link I entered the “I hate Apex and Visualforce Zone” (Dun Dun Dunnnnnnnnnnn). Some dude on a blog (man, everyone has a blog now days) is trying to build a dynamic link menu with data pulled from salesforce objects and using visualforce to display. This seems pretty normal right? Let us check out some excerpts first:

On Apex and Visualforce:

Sounds great in theory, however in reality it makes you want to stab yourself. A lot.

I on the other hand would bathe in it if I could. Oh ya….Visualforce and Apex, sooo bubbly clean. Ya, that was weird. Let’s move on.
Read more…

Categories: Apex, Visualforce

Seattle Force.com Developer Meeting

January 6th, 2010 No comments

Tomorrow, January 7th, there will be another Force.com Developer Meeting in Seattle (first Thursday of every month). If you develop on the Force.com platform with Apex, Visualforce, use the API, or want to learn more about these topics please feel free to join us.

Date: Thursday, January 7th.

Time: 8:00 – 10:00 AM PST

Location: West Monroe Partners
1215 4th Ave Suite 1010
Seattle, WA 98109

The West Monroe Partners office is located on the 10th floor.

Public Parking garages are located in the building, as well as in a 1-2 block radius. The area is also well serviced by public transportation.

The agenda for this meeting will be as follows:

  • Presentation/Demo – Jason Venable (tehnrd.com) will be demoing his runner up application he created for the most recent Force.com Cloud Developer Challenge. The site is GameForce and includes two games: Blackjack and multiplayer connect four. (http://tehnrd-developer-edition.na7.force.com/gamehome). It was built with 100% Force.com, no flash or JavaScript. Jason is a Salesforce.com Admin and Developer at F5 focused mainly on process automation for the worldwide sales team.
  • Open forum – opportunity to discuss any questions/issues you may have about all things Salesforce

If you are planning on attending this month’s meeting, please send me an email (vgrasparil@westmonroepartners.com) to RSVP.

If you would like to present an application you have built or share some best practices you have learned with the group, please let me know so we can schedule it into a future meeting.

See you on January 7th!

Yup, thats me! I’ll be showing off the gaming site I built on force.com, http://www.tehnrd.com/gameforce/. I’ll show off the basic UI stuff but we will also peel back the covers to see how it works the magic on the back end.

Categories: Apex, Visualforce

Batch Apex Status Bar

December 18th, 2009 10 comments

Batch Apex is here and it is cool. In some of the demos and webinars salesforce.com has put together you may have seen a status bar that represents how far along a batch job has proceeded. This is useful as you only need but a quick glance to see how your batch jobs are doing. Below is an image of what this would look like.

batchstatus

All of this magic status bar stuff is pretty simple. You have two divs, an inner and an outer that construct the status bar, the inner being the percent complete. All of the info to construct this status bar is located in a sObject called AsyncApexJob. This stores information about your batch jobs and other asynchronous operations.

The two important fields in this object are JobItemsProcessed and TotalJobItems. When a batch job is executing it may process millions of records but it will break these up into batches of 200, or less if defined……hence the name Batch Apex. So if I have 5,000 records to be processed there would be 25 batches of 200. In the AsyncApexJob object these 25 batches would be the TotalJobItems. As the job runs the number JobItemsProcessed will increase as the batches are completed.

Now that we have these two number calculating the percent complete is an utterly simple division equation. JobItemsProcessed divided by TotalJobItems times 100 gives us the percent complete. We then pass this value to the width of the inner div and our status bar is complete! To give the status bar the appearance of being animated we add an actionPoller to the page and rerender the table of batch jobs every five seconds which will intern update that status bar with the new values.

As always there is a fun little demo to play with and you can access that here: Click here for nifty cool demo.

I’ve also packaged up this component so you can install it directly to your org. You can download it here.

Here is all the code and markup. First the page that will contain the batchJobs component.

<apex:page controller="batchStatus">
    <apex:form>
        <apex:commandButton value="Start Batch Job" action="{!startBatch}" reRender="jobs,error"/> 
        <apex:outputText id="error" value="{!error}" style="font-weight: bold; color: red"/>
 
        <br/><br/>
        <c:batchJobs id="jobs" numberOfJobs="20"/>
    </apex:form>
</apex:page>

Next we have the Visualforce component:

<apex:component controller="batchJobs" selfClosing="true">
    <apex:attribute name="numberOfJobs" type="Integer" assignTo="{!numberOfJobs}" description="The number of batch jobs to display in the table."/>
 
    <!-- Here is the css styles that will be used for the progress bars -->
    <style>
        .progressBar{
            background-color: #f8f8f8;
            border:1px solid #DDDDDD;
            height: 19px;
            width: 300px;
            -moz-border-radius: 5px; 
            -webkit-border-radius: 5px;
        }
        .progress{
            background-color: #F7B64B;
            border:1px solid #E78F08;
            height: 100%;
            margin: -1px;
            text-align: center;
            -moz-border-radius: 5px; 
            -webkit-border-radius: 5px;
            line-height: 18px;
        }
    </style>
 
    <!-- This action poller will check the status of the batch jobs every 5 seconds -->
    <apex:actionPoller rerender="jobs" interval="5"/>
 
    <apex:pageBlock title="Batch Apex Jobs">
        <apex:pageBlockTable value="{!batchJobs}" var="b" id="jobs">
            <apex:column headerValue="Apex Class" value="{!b.job.ApexClass.Name}"/>
            <apex:column value="{!b.job.CreatedDate}"/>
            <apex:column value="{!b.job.CreatedById}"/>
            <apex:column value="{!b.job.Status}"/>
            <apex:column width="320px" >
 
                <!-- Here with have two divs that construct our progresses bar. An outter which is the entire bar,
                and and inner that represents the percent complete. We simply pass the percentComplete value to
                the inner div width and this will show how far along the job is. Brilliant! -->
 
                <div class="progressBar">
                    <div class="progress" style="width: {!b.percentComplete}%;">
                        {!b.percentComplete}%
                    </div>
                </div>
 
            </apex:column>
            <apex:column value="{!b.job.CompletedDate}"/>
        </apex:pageBlockTable>
    </apex:pageBlock>
 
</apex:component>

And finally the custom controller for the component….. where all the magic happens:

public class batchJobs{
 
    public List<BatchJob> batchJobs;
    public Integer numberOfJobs {get; set;}
 
    public List<BatchJob> getBatchJobs(){
        //Create new list of BatchJobs, a wrapper class that includes the job and percent complete.
        batchJobs = new List();
 
        //If number of jobs was not defined, default to 20
        if(numberOfJobs== null || numberofJobs <= 0){
            numberofJobs = 20;
        }
 
        //Query the Batch apex jobs
        for(AsyncApexJob a : [select TotalJobItems, Status, NumberOfErrors, MethodName, JobType, JobItemsProcessed, Id, CreatedDate, CreatedById, CompletedDate, ApexClassId, ApexClass.Name From AsyncApexJob order by CreatedDate desc limit :numberOfJobs]){
            Double itemsProcessed = a.JobItemsProcessed;
            Double totalItems = a.TotalJobItems;
 
            BatchJob j = new BatchJob();
            j.job = a;
 
            //Determine the pecent complete based on the number of batches complete
            if(totalItems == 0){
                //A little check here as we don't want to divide by 0.
                j.percentComplete = 0;
            }else{
                j.percentComplete = ((itemsProcessed  / totalItems) * 100.0).intValue();
            }
 
            batchJobs.add(j);
        }
        return batchJobs;
    }
 
    //This is the wrapper class the includes the job itself and a value for the percent complete
    public Class BatchJob{
        public AsyncApexJob job {get; set;}
        public Integer percentComplete {get; set;}
    }
 
    /*--------------------TEST METHOD------------------------*/
    static testMethod void batchStatusBarTest(){
        batchJobs controller = new batchJobs();
        controller.getBatchJobs();
    }
}

I initially planned on adding all sorts of cool features to this component such as color coding the status bar based on the status of the job and estimated time to completion. These were axed in 1.0 as it was taking too long and there our some other cool posts I have lined up that I want to get working on. Maybe in the future I’ll post an updated version of this component with all the flair it deserves.

UPDATE:

I’ve been asked a couple times what exactly happens when a user clicks the <apex:commandButton value=”Start Batch Job” action=”{!startBatch}” reRender=”jobs,error”/> button. This calls a very simple method in the controller that starts a batch job.

public void startBatch(){
	error = '';
	batchJob job = new batchJob();
	List<AsyncApexJob> openJobs = [select Id from AsyncApexJob where Status = 'Processing' OR Status = 'Queued']; 
 
	if(openJobs.size() < 5){
	        ID batchprocessid = Database.executeBatch(job);
	}else{
		error = 'WHOA BUDDY! Only five batch jobs at a time.';
	}
}

And here is the batch apex job.

global class batchJob implements Database.Batchable<SObject>{
 
    global database.querylocator start(Database.BatchableContext bc){
        return Database.getQueryLocator('select Id, Name from Account where Type = \'Batch Test\'');
    }
 
    global void execute(Database.BatchableContext bc, sObject[] objects){
        List<Account> accns = new List<Account>();
 
        for(sObject s : objects){
            Account a = (Account)s;
            a.Description = 'batch testing. blah blah blah.  ' + system.now();  
            accns.add(a);
        }
        update accns;
    }
 
    global void finish(Database.BatchableContext bc){
       system.debug('all done');
    }
}
Categories: Apex, Visualforce

How to disable Visualforce inputFields

November 25th, 2009 9 comments

Visualforce as a whole is great and is super easy to use once you get the hang of it but every once in a while I come across an issue that makes me go, “What the huh?”. A perfect example of this is that fact that there is no attribute to disable apex:inputFields in Visualforce, what the huh?!? Exactly. You can disable apex:inputText but not apex:inputFields. This can be frustrating as inputFields give you enhanced functionality such as the date picker for date fields, help hovers, and cleaner error messages.

So how can you disable an apex:inputField tag? I don’t know. Just kidding ;-P. Nearly all apex:inputFields when rendered for the browser become HTML input tags and input tags have a disabled attribute. What we can do is manipulate this value with a combination of Apex and Javascript.

Check out the working demo here.

For all my demos I am now trying to build packages so you can install them in your own orgs to play around with. The package is available here.

First is a very simple class. It has one Opportunity that we will bind our inputFields to, a Boolean to determine if the inputField should be disabled, and two methods to set the boolean to true and false.

public class disableInputField {
 
    public Opportunity opp {get; set;}
    public Boolean disableInput {get; set;}
 
    public disableInputField(){
        opp = new Opportunity();
    }
 
    public void disableCloseDateInput(){
        disableInput = true;
    }
 
    public void enableCloseDateInput(){
        disableInput = false;
    }
}

Next up is the page. What we do is place some inline Javascript right next to the input field we want to disable. When clicking the Enable/Disable buttons this will set the boolean value and rerender the oppName panel. When this happens the disableInput boolean value is merged in to the Javascript and since this is a inline Javascript statement it will execute every time the rerender is performed.

<apex:page controller="disableInputField">
    <apex:form >
        <apex:commandButton value="Disable inputField" action="{!disableCloseDateInput}" rerender="oppName"/>
        <apex:commandButton value="Enable inputField" action="{!enableCloseDateInput}" rerender="oppName"/><br/><br/>
 
        Opportunity Name:
        <apex:outputPanel id="oppName">
            <apex:inputField value="{!opp.CloseDate}" id="oppNameInput" required="false"/>
            <script>document.getElementById('{!$Component.oppNameInput}').disabled = {!disableInput}; </script>
        </apex:outputPanel>
    </apex:form>
</apex:page>

And that is how you can disable an inputField. Nice!

Categories: Visualforce

Why JavaScript Scares Me

November 11th, 2009 2 comments

If you have read this blog before you will get the vibe that I am anti javascript. This is a fair assessment as I really don’t like using javascript. I can already hear the people yelling, “JavaScript is great! It can do so many cool things”. Yes, I know, but why add more complexity if I don’t need to? Here is the story of why JavaScript scares me.

This story starts back in my sophomore year of college when I took my first “programming” class. It was basically an intro to computers (easy peasy) but about half of the class was building websites with JavaScript applications. For these assignments we were required to use notepad to build the Javascript and websites. For someone that had never really done any sort of programming this was incredibly frustrating. One wrong character and you were hosed. Oh, and don’t forget this was in the dark ages before Firefox and Firebug. Make change, save, refresh Internet Explorer (blech!), repeat, repeat, repeat. Ugh, this was so lame and left a bad taste in my mouth when it came to “programming”.

screenhunter_13-nov-10-13-33

Next up was CSE142, the intro to programming class that is supposed to weed out computer science majors. This was all java programming and we actually got to use an IDE that would show syntax errors before you compiled. This was probably the hardest class I have ever taken but it has also been the most useful class I have ever taken. After this I was feeling better about programming and things were looking up…… enter the infamous s-control.

Once out of school and at my job, after having an admin role for about six months, I decided to take a stab at updating some s-controls. What a pain. Flashbacks of javascript notepad editing flashed through my head. S-controls are so messy. I wasted hours trying to add basic functionality. Once I got it to work in one browser I realized it didn’t work in another (guess which one). This only reconfirmed my thoughts that javascript is a time suck and a pain to work with. Thankfully Apex and Visualforce were soon released and s-controls with javascript were a thing of the past.

scontrolvs

So where do I stand today? When it comes to Force.com apps I still try to keep my javascript usage to an absolute minimum. I know a lot of the Visualforce pizazz is all based on Javascript but this is script I don’t have to manage. They make sure it works, and works across all browsers.

With all of this said and done I do have a confession to make. I feel like I am having an affair with my own beliefs but I am slowly falling in love with that little bundle of joy know as the jQuery and jQuery UI JavaScript libraries. Once you get over the learning curve of understanding the basics on how to using this library it makes working with JavaScript, dare I say, almost enjoyable. I am still a bit nervous about browser compatibility and the maintenance required but jQuery is lessening these fears. So yes, I am starting to open up a little more to JavaScript and I have some blog posts planned to demo the cool things jQuery can do in tandem with the Force.com platform.

Categories: Technology, Visualforce

Dreamforce 2009 Predictions

November 3rd, 2009 8 comments

Dreamforce 2009 is fast approaching. Last year’s big announcement was Force.com Sites, before that Visualforce, and Apex code before that. What could be the next big announcement for salesforce.com? Here are my predictions.

New UI
Salesforce.com as been working on a new UI for several years now. There was even a chance to get a sneak peak at last years Dreamforce and there have been little teasers scattered through out salesforce presentations for some time now. Salesforce.com leans heavily on the ext JS framework and I fully expect the new UI to boast some of the cooler features this javascript framework can deliver. Another reason I think this may finally be announced is that this new UI will be built upon Visualforce and for the past several months the Visualforce team, which is usually very active, has been laying low on the forums which makes me think this department is cooking up something good.

Visualforce 2.0
This one I am hoping for more than I actually think may happen but there are a few reason I think this announcement could be a possibility. In the past two to three salesforce releases there has been very little progress in regards to enhancements and new features for Visualforce. Similar to my justification for a new UI the VF team has been less involved in the forums so I can only assume they are very busy at work on the next big thing. Another piece of evidence is this one forum post in particular that I still haven’t forgot about: “we are working on visualforce native drag and drop support”, straight from the PM of Visualforce. Drag and drop is a pretty advanced thing to do with javascript so I am hoping there is a new suite of advanced Visualforce components that take advantage of all the cool things javascript can now do but maintains the simplicity and scalability that makes Visualforce so easy to use.

These are my two guesses for the big announcement but I also anticipate smaller announcements such as new partnerships and new integration toolkits, but these are boring.

Do you have any predictions for salesforce.com’s big announcement?

Categories: Visualforce

Seattle Force.com User Group

September 29th, 2009 1 comment

This is sort of a late notice but on October 1st there will be a Force.com user group in Seattle. If you are in the area and want to exchange ideas and best practices revolving around the Force.com platform please swing by.

Want to take a deeper dive into the technical capabilities of Salesforce? Would you like to meet other Force.com developers in the Seattle area? Interested in learning about new/different tools that will help you create and develop better solutions? A new Salesforce user group will be starting up on Thursday Oct 1. Meetings will be held on the first Thursday of every month.

We will try to cover a different range of topics at these monthly meetings such as:

  • Summary of new functionality in the upcoming release
  • Project spotlight where someone will demo their project and the technical details
  • Best Practices
  • 3rd Party development and integration tools
  • Apex and VisualForce
  • Open session to discuss specific questions you may have regarding your current projects

Time: 8-9am
Date: Oct 1, 2009
Location:

West Monroe Partners
1215 4th Ave Suite 1010
Seattle, WA 98161

Please contact Val Grasparil (vgrasparil@westmonroepartners.com) or Andrew Brown (abrown@westmonroepartners.com) if you have any questions.

Since it is in the morning, coffee and snacks will be provided. Please RSVP if you are planning on attending so we can make sure to have enough food for everyone.

Reach out directly to Val to RSVP. I’ve been told there is public parking available at the address above.

Gameforce

August 28th, 2009 7 comments

Update: Video posted below.

This is my first post in nearly three weeks and my first Force.com related post in nearly a month. Where have I been you may wonder? Only working on the coolest Force.com site in the world :-P .  Haha, just kidding.  But yes, for the past 2 months I have been slowly chipping away on my entry for the Force.com Cloud Developer Challenge. So what did I build?

Gameforce - The Worlds 1′st online gaming site built upon the Force.com platform.

When I set out to build my entry I wanted to build something that had never been done before. We have all see the blogging, HR, accounting, shopping cart, content management, and many other traditional business apps. There is no doubt these can be super cool but in the end most of them have been done before. Salesforce.com and Force.com are typically viewed as a platform for business apps and I wanted to build something on the complete opposite end of the spectrum. I hope I have succeeded with building an online gaming site.

The site consists of two games: blackjack and LineUp4 aka Connect 4.

Blackjack
Place your bets and play against the dealer.

blackjack

LineUp4

A true online multiplayer game where two people can play against each other anywhere in the world. It also has the ‘Smack Talker’ which is live chat between the players. You can see more features listed on the about page located here.

lineup4

This site may not have the coolest graphics or the trendiest web design but when it comes to taking the Force.com platform to the limit I have used every trick in the book that I know about. When checking out this site keep in mind it was built with 100% Force.com. There is no extra javascript, flash, or any other web technology.

Video update:
After seeing how cool some of the videos were that other people created showing of their site  I created one as well. It gives a great overview in about 5 minuets. The one feature I forgot to mention in the video is that if you are playing a game of LineUp4 and are not logged in, you can log in, and will be returned to the game right where you left off. The game state will be saved.

http://tehnrd.com/gameforce.swf (if the video is to large for your screen, right click on the video and select ‘Show All’)

Now we wait for the results of the contest. I’m hoping this site puts me in contention for the Mac Book prize. I’m sure there are going to be some great entries but I’m hoping for the best since this site is like nothing I have ever seen before. My current computer is also 5 years old so a new pc definitely wouldn’t hurt. With so many entries in this contest perhaps salesforce could give away a more than one Mac Book ;-) ?

Also, due to the very dynamic nature of this site and the fact that it is currently hosted on a developer edition account I fully expect to exceed the site limits if this site gets popular. I have mirrored this site an a Force.com Free Edition account located here but it does not have the log in ability.

And one more thing. Thanks to my awesome wife for putting up with me while I constantly snuck away to work on this site.