开发者

Javascript Logic Issue in IE

First I'll explain a little bit about my system here. It's a form to allow children to book onto a series of day courses that run in the 开发者_开发知识库school easter and summer breaks. The form allows registration of two children simultaneously, and if the dates for both children are the same, the sibling has a £5 discount for their dates.

On the form, there is a date section which is a series of checkboxes. As you check the checkboxes a total price is calculated at the bottom of the page.

The single child price is £29 and the sibling rate (for those dates that match up to the first child) is £24. There is an additional £16.50 charge for booking onto the horseriding course - but this logic error only extends to the date selection.

For some reason, which I cannot fathom, in Internet Explorer the price for registering 2 children appears £5 less that it should. Here is my code for calculating the dates (the function below is fired onclick of the date checkbox):

function processDates(){
    //contentsA and contentsB are used for outputting on the email confirmation
    valsA = [], dates_A =  document.forms['registerForm']['childADates[]'];
    for(var iA=0,elmA;elmA = dates_A[iA];iA++) {
        if(elmA.checked) {
            valsA.push(elmA.value);
        }
    }
    contentsA = valsA.join(', ');
    //this generates a string based on what dates were selected i.e. April 18th, April 19th etc.


    var valsB = [], dates_B =  document.forms['registerForm']['childBDates[]'];
    for(var iB=0,elmB;elmB = dates_B[iB];iB++) {
        if(elmB.checked) {
            valsB.push(elmB.value);
        }
    }
    contentsB = valsB.join(', ');
    //same as contentA but for the second child.

    //get the total dates for both children
    //fullDates is the number of dates selected (number of checkboxes checked)
    fullDates = (valsA.length + valsB.length);
    siblingDates=0;
    //this detects if entries are matching in the two arrays valsA and valsB
    for(var i in valsA) {
        for(var j in valsB) {
            if(valsA[i]==valsB[j]){
                            //if there are matching dates, increment a siblingDates value to get a total number of matching dates in the siblingDates variable
                siblingDates=siblingDates+1;
            }
        }
    }
    //get the amount of dates to be charged at £29
    fullDates = fullDates - siblingDates;

    fullPrice = fullDates*29;
    siblingPrice = siblingDates*24;
    totalPrice = fullPrice + siblingPrice;
    calcTotal();
}

function calcTotal(){
    var horseA = parseInt(document.getElementById("horseridingA").value);
    var horseB = parseInt(document.getElementById("horseridingB").value);
    var horse =  parseInt(horseA+horseB);
    //Add the horseriding price
    overall = parseFloat(horse*16.5)+totalPrice;
    //output the overall total to the form
    document.getElementById("totalPrice").innerHTML = overall;
}

UPDATE: This process is run when the user selects one of the checkboxes that correspond to each date. April 18th [], April 19th [] etc. These checkboxes are duplicated for the 2nd child. Upon clicking one of the checkboxes the above functions are run that calculate a total price at the bottom of the screen. In internet explorer, clicking a date for ChildA yields £24 not £29, but only on the FIRST date clicked, all other dates both childA and childB are calculated correctly. The first date choice is £5 less than it should be.

I just used IE to select the first date on the main child side and it gave £24, then unselected the same checkbox which gave £-5

UPDATE 2: Okay! I've narrowed down the problem to the below statement:

fullDates = (valsA.length + valsB.length);
siblingDates=0;
for(var i in valsA) {
alert(valsA[i]);
    for(var j in valsB) {
        if(valsA[i]==valsB[j]){
            alert("does equal");
            siblingDates=siblingDates+1;
        }else{
            alert("does not equal");
        }
    }
}

Upon clicking the April 18th checkbox, the first alert (valsA[i]) reads April 18th

The second alert reads "does not equal" as expected.

In Internet Explorer the above happens normally as expected but I get an additional set of alerts:

After the above 2 alerts I get a bizarre function alert that alerts of a string length error, it's about four lines of minified code so very difficult to decipher.

Then the same alert appears again.

Then I get "does equal"


Try changing your loop to this:

for (var i=0; i < valsA.length; i++) {
    for (var j=0; j < valsB.length; j++) {
        if(valsA[i]==valsB[j]){
             alert("does equal");
             siblingDates=siblingDates+1;
        }else{
            alert("does not equal");
        }
    }
}


first up, these lines look wrong, is this how they appear in your code?

for(var iA=0,elmA;elmA = dates_A[iA];iA++)

  for(var iB=0,elmB;elmB = dates_B[iB];iB++) 

try something like this

for(var iA=0;iA < dates_A.length;iA++){
var elmA = dates_A[iA];
...
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜