jQuery array push on button click

Question

i'm following up on a previous question I asked here

I've worked on my code and per the answers from that post, I have eliminated the error. Now, I am not getting any output to console or results from the array in my select menu where before, when I wrote this exercise without using jQuery, i was able to effectively get items into the array and display them in my select menu. In an effort to get a more complete answer I'm posting my full html and javascript/jquery code. If anyone has any input as to why my code isn't working I would appreciate it. My goal was to use jQuery (what i'm learning now) to achieve what i did with javascript alone previously. In this exercise, i'm using a user input field for users to add clients to an array on click of a button. Once that button is pushed, I want my script to check the array to see if it contains the item and if it does not, then push the element into the array and display it in the selection list of existing clients.

<!DOCTYPE html>
<html>

<head>
    <title>Keeper of Time</title>

<link rel="stylesheet" type="text/css" href="kot.css">

<script type ="text/javascript" src="http://code.jQuery.com/jquery-latest.min.js"></script>


</head>
<body>



    <div class="navDiv">

        <ul id="navButtons">
            <li><a href="">Home</a></li>
            <li><a href="">Clients</a></li>
            <li><a href="">Entries</a></li>
            <span><li><a href="">Account</a></li></span>

        </ul>
    </div>

    <div id="errorMessage"></div>

    <div id ="newCltDiv">

        <input id= "newClt" type="text" placeholder="Add a new client">
        <button id="addCltBtn"> Add Client</button>

    </div>

    <br>
    <br>

    <div id="cltListDiv">
        <select id="cltList">
            <option>Select an existing client</option>
        </select>
        <button id="cltSelect">Select Client</button>

    </div>


    <br>
    <br>





    <script type="text/javascript">

    var clientArray = [];
    var clientInput = document.getElementById("newClt");
    var sel = document.getElementById("cltList");
    clientArray.push("box");


        $("#addCltBtn").click(function(){

            var found = $.inArray(clientInput, clientArray);

            if(found >= 0) {
                //Element was found update errorMessage div
                $(errorMessage).html("This Client Already Exists");

            }   else{
                    clientArray.push(clientInput.value);
                    console.log("Objects: " + clientArray.join(", "));
                    updateDropList(clientInput.value);

            }   
        });


        function updateDropList(value){
            var opt = document.createElement('option');
            opt.innerHTML = value;
            opt.value = value;
            sel.appendChild(opt);

        }

        //test
        clientArray.push("soccer");
        console.log(clientArray);





</body>
</html>

When writing a question, try being more specific and concentrate on the problem itself, not the entire code. — Itay
– Itay, Commented May 6, 2015 at 4:10
what are you talking about. this was very specific. And why are you voting this down for no reason? It was a valid question. — Panayiotis Spanos
– Panayiotis Spanos, Commented May 6, 2015 at 4:36
You've written tons of irrelevant information, instead of focusing on the problem. Also, you should probably have put the effort in creating an online example showing your exact problem (i.e jsFiddle). — Itay
– Itay, Commented May 6, 2015 at 4:39
hence why i reference the previous question and answer to increase specificity. I don't know why you're now trying to troll this question. I missed a closing tag and didn't know where the problem was so without showing the entire code there was no way to be certain if the question could even be answered. Your argument is therefore invalid and I would appreciate it in the future if you would be more constructive rather than critical for really no reason. — Panayiotis Spanos
– Panayiotis Spanos, Commented May 6, 2015 at 4:41
I'm not trying to troll you or your question. Again, you've written tons of irrelevant information, while instead of writing what your problem is, you've only written "my code isn't working". So, you didn't say what is your exact problem, you didn't try to recreate your issue online. And that's why I've downvoted your question — Itay
– Itay, Commented May 6, 2015 at 4:45

Shawn Jacobson · Accepted Answer · 2015-05-06 04:10:43Z

1

You need to close your script...</script> and check for the value...

var found = $.inArray(clientInput.value, clientArray);

answered May 6, 2015 at 4:10

Shawn Jacobson

1,3528 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Panayiotis Spanos Over a year ago

jesus. i feel silly now. that took care of it. stared at this for 2 hours. do you use some kind of debugger or editor that you recommend for catching these kinds of silly things?

Shawn Jacobson Over a year ago

I didn't use a debugger, just noticed there was no closing tag. Please accept as the solution.

Panayiotis Spanos Over a year ago

tried to vote up but don't have the reputation to do so. accepted

Shawn Jacobson Over a year ago

Thanks, but it's not a big deal. Thank you for accepting.

Collectives™ on Stack Overflow

jQuery array push on button click

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related