capturing the element in javascript

Question

i would like to display the error message in the input element itself instead of showing an error message separately. how would i capture the element in which the message needs to be displayed?

this the code:

function checkForm(form) { 

        if (yname.getValue() == "" || yname.getValue() == "Your Name" || name.getValue() == "" || name.getValue() == "Name of the Book" || url.getValue() == "" || url.getValue() == "URL of the Book"){
              [id-of-the-element].setTextValue("Field cannot be empty!");
             return false;
        }  

Answer 1

this is plain java script code if you are not using jquery

document.getElementById("id-of-the-element").value = "Field cannot be empty!";

Answer 2

You can "extend" your condition statement:

function checkForm(form) {
    var result = true;
    if (yname.getValue() == "" || yname.getValue() == "Your Name") {
        setErrorMessage(yname);
        result = false;
    } else if (name.getValue() == "" || name.getValue() == "Name of the Book") {
        setErrorMessage(yname);
        result = false;
    } else if (url.getValue() == "" || url.getValue() == "URL of the Book") {
        setErrorMessage(yname);
        result = false;
    }
    return result;
}

function setErrorMessage(field) {
    field.setTextValue("Field cannot be empty!");
}