CODEWITHSUNDEEP
javascript
Guest012393
Guest012393

Reputation: 255

How to retrieve text from an input

I have an edit button, on click every td in the row will become input text, in my code it works, but the problem is that I can't find a way to retrieve the text in the input so i can save it later.

   function Edit(clickedButton){
        var getTR = clickedButton.closest('tr');
        var getLength = getTR.childElementCount;
        var getTds = getTR.querySelectorAll("td")

        for (i in getTds) {
            if(i < (getLength-1)) {
                getTds[i].innerHTML = "<input  type='text' value='"+getTds[i].innerHTML+"'>";
            }       
        }

    }

Upvotes: 0

Views: 63

Answers (2)

MsO
MsO

Reputation: 87

Get it by the id

document.getElementById('textbox_id').value

or

Get it by the class

document.getElementsByClassName('class_name')[element_index].value

or get it by the tag name

document.getElementsByTagName('tag_name')[whole_number].value

Upvotes: 1

pawel
pawel

Reputation: 36965

In your loop body add an event listener to the created input, for example bind to blur event to do something with the value once the input loses focus:

getTds[i].innerHTML = "<input  type='text' value='"+getTds[i].innerHTML+"'>";
getTds[i].getElementsByTagName('input')[0].addEventListener('blur', function(){
    console.log( this.value );
})

simplified example: http://jsfiddle.net/Lr08emod/

Upvotes: 0

Related Questions