CODEWITHSUNDEEP
javascriptjquery
Ron
Ron

Reputation: 33

Javascript / JQuery Conflict

I am a newbie to this. I have two javascript / jquery on my page. If I use 1st Script, the 2nd one doesn't work. If I remove the 1st script, the 2nd one works fine. I don't know how to solve this issue. I know there is a "no conflict" script. I tried but that didn't work out. I maybe tried in wrong way. Please someone help me. How can I run both of them? I have posted both the script below:

Script Number 1:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){
    $(".sign_in").click(function(){
        $("#sign_box").show();
        return false;
    });
    $("body #headerwrap").click(function(){
        $("#sign_box").hide();
        return false;
    });
});

</script>

Script Number: 2

<script language="javascript" type="text/javascript">

var fieldstocheck = new Array();
fieldnames = new Array();
function checkform() {
    for (i=0;i<fieldstocheck.length;i++) {
        if (eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value")==""){
            alert("Please enter your "+fieldnames[i]);
            eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].focus()");
            return false;
        }
    }
    return true;
}
function addFieldToCheck(value,name) {
    fieldstocheck[fieldstocheck.length] = value;
    fieldnames[fieldnames.length] = name;
}
</script>

Upvotes: 1

Views: 115

Answers (3)

isick
isick

Reputation: 1487

There's no conflict.

The first script has a click listeners that return false. I'm assuming the sign in button is used to submit the form.

Returning false on that click event will prevent the form from submitting which means the execution path will never enter your functions in the second script.

Consider removing the return false.

EDIT: Here's some more information on why it's generally bad practice to return false (unless you know exactly what you're doing and why)

http://firebreaksice.com/avoid-return-false-in-jquery-click-bindings/

Upvotes: 0

Patrick Gunderson
Patrick Gunderson

Reputation: 3281

Just a note about eval. You don't need to use eval in the way you're using it. You can simply use the bracket notation directly:

eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value")

is the same as

document.subscribeform.elements[fieldstocheck[i]].value

and 

eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].focus()");

is the same as

document.subscribeform.elements[fieldstocheck[i]].focus();

Upvotes: 1

NenadP
NenadP

Reputation: 647

Where is second script on the page ? It would need a bit more info about it to see what's happening.

Second script looks very ominous, probably very old script. Some points of concern:

  • All your code is thrown at global object
  • fieldnames is not declared (missing var)
  • Declaring array with [] is prefferable to new Array() syntax
  • addFieldToCheck and checkform functions seems not to be used (at least not in the code you posted)
  • it uses eval which is considered a bad practice

For a good start try wrapping your second one in self invoking anonymous function:

(function() {
  var fieldstocheck = [],
    fieldnames = [];

  function checkform() {
    //... 
  }

}());

Upvotes: 1

Related Questions