1

I noticed that I'm experiencing UI issues with every Salesforce instance that I have access to when I create a custom VisualForce page using a custom controller and that I display a lookup field on it. This is happening on every browsers that I tried (IE7/8/9, Chrome...).

Here's an example with a custom controller:

This example VF page is using a custom controller called MyCustomController:

<apex:page controller="MyCustomController">
    <apex:form>
        <apex:inputField value="{!c.AccountId}"/>
    </apex:form>
</apex:page>

Here's the controller (I coded this on-the-fly in the browser, didn't test it (just for the example)):

public with sharing class MyCustomController {
    public  Contact c   { get;set; }

    public MyCustomController() { 
        c = new Contact(); 
    }
}

Then, when I head to the page with the lookup field and I try (for example) to toggle the sidebar, there's nothing happening when I click on it:

Cannot toggle sidebar

Also, the tab do not seem to stack anymore when it's larger than the screen width, generating an horizontal scrollbar:

Tabs are not stacking

Other UI issues also occur, but they are a little bit harder to explain/show. They all seem to be JavaScript-related.

This is only happening when there's a lookup field displayed on the page. When I add any other fields (number, text, etc.), this isn't happening. When I extend a standardController, I do have the same issue.

Here's an example with a standard controller:

<apex:page standardController="Contact">
    <apex:form>
        <apex:inputText value="{!Contact.AccountId}"/>
    </apex:form>
</apex:page>

Using the standard controller, I can now toggle the sidebar and the tabs are stacking correctly, without horizontal scrollbar.

Stacked tabs

When I look at the Chrome Developer Console, I get this error using the custom controller:

Uncaught TypeError: Cannot set property 'onkeyup' of null 

Using the standard controller, I get this message (not an error):

Resource interpreted as Script but transferred with MIME type text/html: "https://na5.salesforce.com/servlet/servlet.Integration?lid=#######".

Any idea how to fix that? Thanks a lot!

  • If i test your code (controller+page) i get the following error: Expression value does not resolve to a field Error is in expression '{!c.Account}' in component <apex:inputField>. You not? – Sergej Utko May 29 '13 at 19:52
  • As I said, I wrote that example code on the fly, since my actual code contains confidential information. The Apex controller code was just to show the general concept of having a basic getter. – jpmonette May 29 '13 at 19:57
  • Ok got it. But all is ok for me, there are no errors. – Sergej Utko May 29 '13 at 19:57
1

It seems like there was a JavaScript added in the sidebar that I was unaware of:

App Setup > Customize > Home > Home Page Components > Company Message

This was most likely interfering with Salesforce.com core JS libraries.

I'm a little bit surprised to learn that we can include JS on every pages this way. Adding JavaScript libraries this way seems to me like a big workaround. This possibility could probably lead to something worst than UI issues.

  • You should mark this as the answer. Being able to put javascript in the sidebar is useful in many cases and really it's up to the author of the code to ensure that their code isn't breaking other aspects of salesforce. – Phil Rymek May 30 '13 at 14:34
  • I have to wait 24 hour to set this as an answer. – jpmonette May 30 '13 at 14:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.