6

I am using Jquery Form Plugin to submit my form. The head tag of my html file looks like following

<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
 then 10 other javascript files

AND Then   
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery.form.js">
<script type="text/javascript"> 
       $(document).ready(function() { 
      var options = { 
                       success:       showResponse
                         };
                         $('#myForm').ajaxForm(options); 
        }); 
  </script>         

To see the actual picture of my code please check this http://jsfiddle.net/Xfrms/1/

The problem is even though I call jquery library on the very top of my code, if I don't call the jquery library right before the jquery.form.js plugin then it (jquery.form.js) doesn't work. I have tried to call those 10 other javascript files after the query.form.js plugin calling the jquery library on the very top but in this case the functionality for which the javascript files are being called doesn't work.

After seeing this post, I think calling jquery twice can cause problems.

Could you please tell me what could possibly going wrong in my code and how to avoid having to load jquery right before the the jquery form plugin but still get it working?

Thanks

6
  • What are the 10 other javascript files? Do any of them also declare $ as something? Do any of them call jQuery.noConflict()?
    – MrOBrian
    Jul 24, 2012 at 18:56
  • Thanks for your reply MrOBrian. Yes. most of them also declare $ but none of them call jquery.noConflict() do you have any suggestion? thanks :)
    – black_belt
    Jul 24, 2012 at 19:01
  • by "declare $" I mean set it something else, something other than jQuery. Are you using another library, similar to jQuery, that is overwriting jQuery?
    – MrOBrian
    Jul 24, 2012 at 19:05
  • No, I am not using any other library. Please check this link jsfiddle.net/Xfrms/1 This will give you an idea about my scripts. Thanks
    – black_belt
    Jul 24, 2012 at 19:09
  • do you think the problem is because of conflict between multiple jQuery files?
    – black_belt
    Jul 24, 2012 at 19:11

2 Answers 2

7

As I can imagine your problem is that some of the other libraries is using the $ keyword markup to instantiate each calls. If I am correct the just try the following and you will be all set to go..

var $jq = jQuery.noConflict();

Then for all of your jquery calls try use your new markup.. the $jq.

For more detailed info check out this page: http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Use the js script reference at the beginning of your page to ensure that all code is loaded properly at start. Moreover it is likely that some error could be populated from loading all scripts.. To check if any errors exist, use some debugging plug in like Firebug.

3

Have you tried:

window.jQuery || document.write('<script src="js/jquery-1.7.2.min.js"><\/script>')
2
  • Correct me if I am wrong but don't you use the code so that when CDN-hosted jQuery is momentarily down, you fall back to a locally hosted version?
    – black_belt
    Jul 24, 2012 at 19:04
  • 1
    It can be used for that too. Basically this just checks to see if jQuery is defined and if not, writes it to the browser.
    – j08691
    Jul 24, 2012 at 19:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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