2

I was working on Jquery with Visualforce and noticed that the page was fine with showheader = false and when I used showheader="true" I ended up having the following error in my console:

Uncaught TypeError: undefined is not a function dynatree?core.apexpages.devmode.url=1:46 Uncaught ReferenceError: initViewstateTab is not defined

This post: Why would my table render different when using showheader=false? says salesforce will apply a lot of their standard css to the page. Setting standardstylesheets="false" does not seem to fix this errors.

Do I need to use showheader = "false" when I use jquery with third party libraries.Some examples pointed out by @metadaddy :https://success.salesforce.com/answers?id=90630000000gi24AAA and https://developer.salesforce.com/forums/ForumsMain?id=906F000000098ppIAA use showheader="true" and most of them do not have third party JS included.

Please clarify why and how the showheader flag affects the VF page when used with Jquey.

Was answering this question and ended up having a question :/ Loading Dynatree Jquery library in Visualforce

Page : 

<apex:page standardStylesheets="false" sidebar="false" showHeader="false">
<!-- jQuery files -->

<apex:includeScript value="{!(URLFOR($Resource.DynaTreeJQjs))}"/>
<apex:includeScript value="{!(URLFOR($Resource.DynaTreeCustomjs))}"/>
<apex:includeScript value="{!(URLFOR($Resource.DynaTreeCookiejs))}"/>


<!-- DynaTree files -->
    <apex:includeScript value="{!(URLFOR($Resource.DynaTreejs))}" />
    <apex:stylesheet value="{!(URLFOR($Resource.DynaTreecss))}" />

<script type="text/javascript">
$j = jQuery.noConflict();

    $j(function(){
        // Attach the dynatree widget to an existing <div id="tree"> element
        // and pass the tree options as an argument to the dynatree() function:
        $j("#tree").dynatree({
            onActivate: function(node) {
                // A DynaTreeNode object is passed to the activation handler
                // Note: we also get this event, if persistence is on, and the page is reloaded.
                alert("You activated " + node.data.title);
            },
            persist: true,
            children: [ // Pass an array of nodes.
                {title: "Item 1"},
                {title: "Folder 2", isFolder: true,
                    children: [
                        {title: "Sub-item 2.1"},
                        {title: "Sub-item 2.2"}
                    ]
                },
                {title: "Item 3"}
            ]
        });
    });
    </script>

<body>
    <!-- Add a <div> element where the tree should appear: -->
    <div id="tree"> </div>
</body>

</apex:page>
Improve this question

1 Answer 1

Reset to default
2

It sounds like jquery is conflicting with a salesforce script library. You will probably need to use jQuery.noConflict() to give up control of the $. Using something like this below you would just need to replace any $ in your script to $j

$j = jQuery.noConflict();

https://api.jquery.com/jQuery.noConflict/

Improve this answer
1
  • Craig I do have the JQuery.noConflict. I will update the question
    – Rao
    Commented Apr 14, 2014 at 22:09

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .