It occurs to me not to show the submit button until the input field contains some value entered by the user.
I would add a "placeholder" to notify the user that it is a field that needs to be completed.
And I would use the JQuery library.
Important!
The JQuery library must be loaded AFTER loading all styles on the page.
That is, load all CSS libraries or styles BEFORE loading the necessary JQuery.js libraries.
/* PRIMERO VERIFICAMOS QUE TODAS LAS LIBRERIAS CSS SE CARGUEN ANTES
QUE LAS LIBRERIAS JQUERY */
<link rel="stylesheet" type="text/css" href="estilo.css">
/* Y LUEGO... */
<script src="/la_ruta_de_tu_dominio/jquery/jquery-3.1.1.min.js"></script>
<script>
$(document).ready(function(){
$("#submit").hidden();
$("#id_input").change( function() {
if ($('#id_input').val() === '') {
$("#submit").hidden();
alert("El campo esta vacío");
} else {
$("#id_submit").show();
}
});
});
</script>
Anyway, and before sending information to the MySQL database, it is necessary to check what was entered in the INPUT from PHP to avoid SQL injections.
The validation from JS on the client side will never be 100% safe for that because it can be modified before.