I have a form (just one field) which I am populating with some data. I would like to get me Div container populated with the data I put there in a real time. So no refresh, after I type in some text in the form field, I get it in the div as well. Does anybody know how to do it? JQuery, AJAX?Any advice appreciated.

I have a form (just one field) which I am populating with some data. I would like to get me Div container populated with the data I put there in a real time. So no refresh, after I type in some text in the form field, I get it in the div as well. Does anybody know how to do it? JQuery, AJAX?Any advice appreciated.

• javascript
• jquery
• forms
• html

Share Improve this question Follow asked Jun 28, 2011 at 0:07 VonderVonder 4,0591515 gold badges4646 silver badges6363 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

var div = $('div')[0];

$('input').bind('keyup change', function() {
    div.innerHTML = this.value;
});

Try it out: http://jsfiddle/H6P2z/

Of course you should make the selectors specific to your actual elements.

With jQuery you can do this very easily:

$('#textFieldId').bind('change', function (event, previousText) {
    $('#divId').html($(this).val());
});

You could bind an onkeyup event to the input field. When the event fires, you can grab the contents of the field and do what you want with it.

This might look like this:

$(selector).keyup(function(e) {
   // find the value of the field
   var text = $(this).val();

   // do something with it
   $(yourDivSelector).html(text);
});