JS - Display a msg for only a few seconds

[deadmancoder]

i have a form.. i validated it..
if the form has an empty field, instead of popping up an alert box, i need to display a message that goes off say after 5 seconds..
any idea of how to do it?

[digital-ether]

i have a form.. i validated it..
if the form has an empty field, instead of popping up an alert box, i need to display a message that goes off say after 5 seconds..
any idea of how to do it?

You can create or display and HTML Element, that has the message.

Example of creating one:

var msg  = documement.createElement('div');
msg.innerHTML = 'Your message';

Then attach that div to whatever element you want it to display on:

eg:

HTML:

<p class="field">
<label for="form-field-id">Label</label>
<input id="form-field-id" name="form-field-id" />
</p>

// create message element
var msg  = documement.createElement('div');
msg.innerHTML = 'Your message';
// attach it to the DOM
var field = document.getElementById('form-field-id');
field.parentNode.appendChild(msg);

That would append it as a child of <p class="field"> which is the parentNode of <input id="form-field-id" name="form-field-id" />.

To remove it you set a timer.

clearTimeout(timer);
timer = setTimeout(function() {
msg.parentNode.removeChild(msg);
}, 5000);