1

I have a large asp.net 2.0 application. In the current page i have one

<head id="head1" runat="server"> with some meta information and the original developer has written all Javascript functions in the <body> tag. Now i want to implement 

$(document).ready(function load()
    // My code 
});

and when i include jquery-1.8.3.js in my head/body tag , the other javascript functions are not working properly. what could i do to solve this?

 <head id="Head1" runat="server">`
 <script language="javascript" type="text/javascript" src="JScript/jquery-1.8.3.js"/>`
 <meta http-equiv="Expires" content="0" />
 <meta http-equiv="Cache-Control" content="no-cache" />
 <meta http-equiv="Pragma" content="no-cache" />
 <title>HMS</title>
 <link href="Css/MyStyleSheet.css" rel="stylesheet" type="text/css" />
 </head>

Body 

<body>
<script language="javascript" type="text/javascript" src="JScript/MediReckonerJscript.js">
</script>
//some javascript functions here that are not firing since i added jquery reference in the head section. if that is removed this function works well.

My script in body that usesjQuery Library.

<script type="text/javascript" language="javascript"> 
//This is my script in the <body> tag.
jQuery.noConflict();
$(document).ready(function load() {
  var iFrame = $('#PageFrame');

iFrame.bind('load', function() { //binds the event
    alert('iFrame Reloaded');
});
});
</script>
Sakthivel
  • 1,890
  • 2
  • 21
  • 47
  • 2
    First of, you have to give some more information. What errors do you get? I see you forgot `{` after `load()`, but maybe that's just a typo. – Mario S Mar 07 '13 at 08:33
  • 2
    how many jquery libraries do you include in your page? – arjuncc Mar 07 '13 at 08:34
  • and also is your page contain UpdatePanel or ajax calls – Devjosh Mar 07 '13 at 08:34
  • I Would need more context to understand the Problem, what functions dont work? Those the original Code use a diverent jQery Version, those the original code defined its own `$`-function .... – winner_joiner Mar 07 '13 at 08:35
  • check your browser console – Arun P Johny Mar 07 '13 at 09:09
  • @mario I dont get any errors. The javascript functions to simulate menu and submenu are not running. If i add it jquery.js file in the head the menu styles are dead. if i add jquery.js in the body, any script below that are not firing – Sakthivel Mar 07 '13 at 09:26
  • @arjuncc i have included only one jquery file. jquery-1.8.3.js – Sakthivel Mar 07 '13 at 09:27
  • @Devjosh Yes, the current page has ajax libraries and calls.. – Sakthivel Mar 07 '13 at 09:27
  • You must get an javascript-error. Look in the developer tool in your browser. For example, the console in Chrome or IE (hit F12). – Mario S Mar 07 '13 at 09:28
  • 1
    @codebrain please refer this previous link http://stackoverflow.com/questions/301473/rebinding-events-in-jquery-after-ajax-update-updatepanel – Devjosh Mar 07 '13 at 09:32
  • The problem comes because of JQuery library conflict with other JavaScript library. Please visit [http://api.jquery.com/jQuery.noConflict/](http://api.jquery.com/jQuery.noConflict/) – Prabhakaran Parthipan Mar 07 '13 at 08:38

2 Answers2

1

Perhaps this could be the version problem please check with some lower version of the same library also you can use jQuery.noConflict(); for jQuery is conflicting OR $.noConflict(); if $ is conflicting.

Use noConflict() like this 

 <script type="text/javascript" language="javascript"> 
//This is my script in the <body> tag.
var j = jQuery.noConflict();
j(document).ready(function load() {
  var iFrame = j('#PageFrame');

iFrame.bind('load', function() { //binds the event
    alert('iFrame Reloaded');
});
});
</script>
Ravi Soni
  • 2,210
  • 3
  • 31
  • 53
0

If you have other libraries in your page add this.

jQuery.noConflict();

Libraries like prototype use the same '$' used by jQuery and so, they conflict.

Mario S
  • 11,715
  • 24
  • 39
  • 47
MayThrow
  • 2,159
  • 4
  • 24
  • 38