How to resolve jQuery conflict with other script code

Shell RS

Using jQuery with other javascript code that also uses $ as alias, may break one of your script code. To resolve the conflict, jQuery provide noConflict() method. Let me share, how it resolved the problem, I was facing.

I added following jQuery code to validate a form.

<script type="text/javascript">
$(document).ready(function() {
 $("#form").validate();
 $("input.valid").click(function() {
  if ($("#form").valid() == false ) {
   return false;
  }
 });
});
</script>

Aha! It did break my existing functionality. As my existing java script was also using the $ as alias. To sort out the issue, modified the code as shown below:

<script type="text/javascript">
$.noConflict();
jQuery(document).ready(function() {
 jQuery("#form").validate();
 jQuery("input.valid").click(function() {
  if (jQuery("#form").valid() == false ) {
   return false;
  }
 });
});
</script>

I added $.noConflict(); that tells existing java script $ alias will be used not the jQuery one. For using the jQuery code, instead of using the alias $, I simply used the jQuery. Thats it, my both script code are working fine.

More about jQuery.noConflict().

As usual, thanks for reading! Please put your comments to share your views and feedback.
- InstantKick Team