mercredi 26 avril 2017

How to change the text of a checkbox in JavaScipt?

Note: Willing to use jQuery, whatever is easier.

I have a form which when submitted, creates a checkbox input. The text of the checkbox should be equal to that of another text input when the form is submitted.

The checkbox is created as expected when I submit the form but it is blank and doesn't contain the text from the corresponding text area.

For a checkbox i'm not sure if I should be using .text, .innerhtml, .val etc and the previous questions I saw on here seemed unnecessarily complicated.

HTML:

<div id="listContainer">
    <form id="listForm">
        <input type="submit" value="Add">
        <input id="listInput" class="textarea" placeholder="Add your list item here, then click submit.">
        <div id="checkboxContainer">
        </div>
    </form>

</div>

JS:

//ADD LIST ITEM
$("#listForm").submit(function(ev) {
    ev.preventDefault();
    if ($("#listInput").val() == "") {
        alert("Please enter the item name, then click 'Add'.");
    } else {
        listCount++;
        var input = $("#listInput").val();

        console.log("List Count: " + listCount);
        console.log(input);

        var cb = document.createElement('input');
        cb.id = 'input' + listCount;
        cb.type = 'checkbox';
        document.getElementById("checkboxContainer").appendChild(cb);


        $("#input" + listCount).text(input);

        //Store the list count
        localStorage.setItem("listCount", listCount);

        //Store the list title
        localStorage.setItem("input" + listCount, input); //"Note " + noteCount + ": " + 

        this.submit();
    }
});




Aucun commentaire:

Enregistrer un commentaire