Getting error : Uncaught TypeError: undefined is not a function bootstrap.js:29 (anonymous function) bootstrap.js:29 (anonymous function)
Asked Answered
T

2

21

I'm getting the following error

    Uncaught TypeError: undefined is not a function bootstrap.js:29
(anonymous function) bootstrap.js:29
(anonymous function)

in my visualforce page in the developer console.I'm trying to integrate twitter-bootstrap in Visualforce

Here is the complete visual force code

    <apex:page standardStylesheets="false" showHeader="false" sidebar="false">
    <!-- Begin Default Content REMOVE THIS -->

    <head>
        <apex:stylesheet value="{!URLFOR($Resource.bootstrap, 'bootstrap/css/bootstrap.css')}"
        />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"
        type="text/javascript"></script>
        <apex:stylesheet value="{!URLFOR($Resource.bootstrap, 'bootstrap/css/bootstrap.min.css')}"
        />
        <apex:includeScript value="{!URLFOR($Resource.bootstrap, 'bootstrap/js/bootstrap.js')}"
        />
        <apex:includeScript value="{!URLFOR($Resource.bootstrap, 'bootstrap/js/bootstrap.min.js')}"
        />

    </head>

    <body>
        <div id="force">
            <div class="input-append" align="center" style="padding-top:20px;">
                <input type="text" name="q" class="span2 search-query" placeholder="Snipp or Tag"
                />
                <button type="submit" class="btn">Search</button>
                <div class="pull-right">
                    <button class="btn btn-primary active"><i class="icon-white icon-plus"></i> A</button>
                    kjhkjdfgdgdfgdfgdfgdfgdgfgdfg
                    <button class="btn btn-primary active"
                    style="margin-right:50px;"><i class="icon-white icon-bullhorn"></i> Fee</button>
                </div> 
            </div>
        </div>
    </body>
</apex:page>

Here is a link to the page jady-developer-edition.ap1.force.com

Can any one throw some light on what might be wrong.

Tricolor answered 23/1, 2013 at 13:15 Comment(1)
So what's around line 29?Signal
S
38

You need to include jquery before including the bootstrap js-file.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="/resource/1358914798000/bootstrap/bootstrap/js/bootstrap.js"></script>

note that you don't need both bootstrap.js and bootstrap.min.js

Sudanic answered 23/1, 2013 at 13:38 Comment(4)
jady-developer-edition.ap1.force.com ... in the source, the bootstrapfile is included before jquerySudanic
But in my code i have given it above..i dont know why its rendering that wayTricolor
I'm not familiar with visual force, but your not including the jquery lib with "apex:includeScript"Sudanic
ok thanks dat helped...referring directly wasn't working...i referred it like i included other scriptsTricolor
P
1

This can be caused if you are including bootstrap.js before jquery.js. So make sure you are including jQuery before bootstrap.

There are other things to check.

Also one more possible case is, there could be multiple instances of jQuery in the page. So search for a duplicate version of jQuery and remove them if there is any.

Find below link for more information.

Avoiding Conflicts with Other Libraries

Pennebaker answered 14/8, 2015 at 13:36 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.