Question

Hii.
How can we can check whether a value of a HTML component is null or not when we click a button on client side itself.
If value is null it shows a warning.
Thanks in advance..

Answer 1

You need to use JavaScript and bind an event listener on the button or on the form containing the button to check the value of the field and forbid the click or the form submission if the value is empty.

The precise answer depends on what you’re using at client-side and what browsers you want to support (raw JavaScript, JQuery, …)

Here’s an example with raw JavaScript:

<form onsubmit="return validate();">
    <input type="text" name="myField" id="myFieldId"/> 
    <input type="submit"/>
</form>

<script type="text/javascript">
    function validate() {
        var myField = document.getElementById("myFieldId");
        if (myField.value.length == 0) {
            alert("the field is empty");
            return false;
        }
        return true;
    }
</script>