blank or empty message error message - html no with PHP-CodePudding

I would like to do with HTML or Javascript not with PHP an error message when the text is empty. I have created the code ,it is a part of my code form that has a text name.I have seen tutorials or same answers here but I wasn't able to do this.

<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="jquery-1.7.1.min.js"></script>
    <script>
   function ValidateForm() {
    if($("#onoma").val()=="") {
        $("#error_msg").html("Field needs filling");
    }              
}

    </script>

in the body parts I have this code :

<label  class="required"  for="onoma">Όνομα</label>
    <input type="text" id="onoma" name="firstname" placeholder="Your name..">

CodePudding user response：

One option is:

If your input textbox is inside a <form> (as it probably should be) you can just put required on the textbox and it'll validate automatically when you try to submit the form, without needing any kind of script.

Demo:

<form>
  <label class="required" for="onoma">Όνομα</label>
  <input type="text" id="onoma" name="firstname" placeholder="Your name.." required>
  <button type="submit" name="submit">Submit</button>
</form>

Documentation: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/required

There is a variety of other built-in validation functionality in HTML5 too - see https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation for an overview.