CODEWITHSUNDEEP
javascripthtmlforms
Lilly Shk
Lilly Shk

Reputation: 147

On typing/entering data in text box getting the entered value to display

I have a text box, after entering which i need to get that value and display in alert box,without using any forms or buttons.

This is what I used: But its not working ,it gives null value on loading of the file.

HTML 

<tr>
    <td><br>Address of Patient</td>
    <td> <br> <input type="text" name="inc_patientAddress" id="inc_address" required></td>
</tr>

Jvascript

<script type="text/javascript">
var x = document.getElementById('inc_address');
alert(x.value);
</script>

I want to display the text box value after entering the data in text box , Is it possible? Please help

Upvotes: 0

Views: 1425

Answers (3)

ANR Upgraded Version
ANR Upgraded Version

Reputation: 949

Try this

For every input 

$('#inc_address').on('input', function() {
alert($(this).val());
});

Working Fiddle Here

For every complete Input

$('#inc_address').on('change', function() {
alert($(this).val());
});

Working Fiddle Here

Upvotes: 1

Rahul Khandelwal
Rahul Khandelwal

Reputation: 104

You need to add blur function for that input. As soon as it will lost focus from that text box it will call this function and so the alert will be displayed.

<input type="text" name="inc_patientAddress" id="inc_address" onblur="myFunction()" required>

Call this funtion on blur:

myFunction(){
      alert("#inc_address").value();
}

Upvotes: 0

Tushar
Tushar

Reputation: 87203

Use blur event:

document.getElementById('inc_address').addEventListener('blur', function() {
    console.log(this.value);
}, false);

Demo: http://jsfiddle.net/tusharj/hop3szu4/

Docs: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

Upvotes: 1

Related Questions