current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite
1

I am having problems deleting items from my array using splice. First of all I have an Array called player which contains three other Arrays called tier1, tier2 and tier3. All three of these Arrays have values stored within them which I am looking to manipulate. I have a input and a button on my page which when clicked activates the JS function relevant to splicing the Array. I have set up an IF statement with FOR loops in order to look through tier1 to check if the input text matches a value within the array, if the text can't be found in tier1 it is supposed to then do the same for tier2 and then tier3 and finally displaying an error message if the input text is not within any of the arrays. The function works fine if the input text is in tier1 but for some reason it doesn't seem to run through the else if statement, I have provided my code below I am unsure if this is just a syntax error or if I am missing some sort of functionality. Many thanks in advance

var player=[]
var tier1=["p1","p2","p3"]
var tier2=["p4","p5","p6","p7"]
var tier3=["p8","p9","p10","p11"]

function removeFunction() {
    if (document.getElementById("removePlayer").value !== "") {
        for (index = 0; index < tier1.length; index++) {
            if(document.getElementById("removePlayer").value == tier1[index]) {
        tier1.splice(index, 1);
            playerFunction();
            playerAlert = "Player Removed";
            document.getElementById("test1").innerHTML = playerAlert;
            document.getElementById("test2").innerHTML = tier1;
    }}
    } else if (tier1[index] !== document.getElementById("removePlayer").value) {
        for (index = 0; index < tier2.length; index++) {
        if(tier2[index] == document.getElementById("removePlayer").value) {
            tier2.splice(index, 1);
            playerFunction();
            playerAlert = "Player Removed";
            document.getElementById("test1").innerHTML = playerAlert;
            document.getElementById("test2").innerHTML = tier2;
        }}
    } else if (tier2[index] !== document.getElementById("removePlayer").value) {
        for (index = 0; index < tier3.length; index++) {
        if(tier3[index] == document.getElementById("removePlayer").value) {
            tier3.splice(index, 1);
            playerFunction();
            playerAlert = "Player Removed";
            document.getElementById("test1").innerHTML = playerAlert;
            document.getElementById("test2").innerHTML = tier3;
        }
    }} else {
        playerAlert = "Nothing happened";
        document.getElementById("test1").innerHTML = playerAlert;
    }
}

http://jsfiddle.net/9r73ntsc/1/

share|improve this question
    
JsFiddle of this , would be much appreciated ! –  MonkeyPatch Nov 10 '14 at 12:55
    
@CodingAnt edited my question to include it, onload function doesn't work but it is supposed to show the player array, my first time using jsFiddle so I'm probably not doing it right –  user2213523 Nov 10 '14 at 13:04
    
This doesn't work with fiddle, because all javascript get's automatically wrapped in a function that get's executed on document.onload by jsfiddle. Therefor the function you assign to your body onload doesn't exist, when you try to assign it. You can however turn off this function from jsfiddle on the left, where it says "onload" –  Markai Nov 10 '14 at 13:07
    
@Markai thanks I have changed the onload and it now works –  user2213523 Nov 10 '14 at 13:10

1 Answer 1

up vote 0 down vote accepted

This will help you

function removeFunction() {
    if (document.getElementById("removePlayer").value !== "") {
        for (index = 0; index < tier1.length; index++) {
            if (document.getElementById("removePlayer").value == tier1[index]) {
                tier1.splice(index, 1);
                playerFunction();
                playerAlert = "Player Removed";
                document.getElementById("test1").innerHTML = playerAlert;
                document.getElementById("test2").innerHTML = tier1;
                return;
            }
            if (document.getElementById("removePlayer").value == tier2[index]) {
                tier2.splice(index, 1);
                playerFunction();
                playerAlert = "Player Removed";
                document.getElementById("test1").innerHTML = playerAlert;
                document.getElementById("test2").innerHTML = tier2;
                return;
            }
            if (document.getElementById("removePlayer").value == tier3[index]) {
                tier3.splice(index, 1);
                playerFunction();
                playerAlert = "Player Removed";
                document.getElementById("test1").innerHTML = playerAlert;
                document.getElementById("test2").innerHTML = tier3;
                return;
            }
        }
    }
    playerAlert = "Nothing happened";
    document.getElementById("test1").innerHTML = playerAlert;
}

EDIT: corrected final IF statement from tier2[index] to tier3[index]

share|improve this answer
    
this is excellent it works perfectly, I will spend some time reading into the return statement you have included. Thanks a lot, I would upvote this but I don't have the reputation sadly –  user2213523 Nov 10 '14 at 13:17

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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