Проверьте пустое поле в форме HTML и покажите окно сообщения, если есть пустое поле/s

Question

im работает над проектом о веб-системе. У меня есть форма, я хочу проверить, заполнены ли все поля, но когда одно из полей пуст, оно отобразит приглашение и не будет записывать данные в базу данных, если форма не будет заполнена. Я могу показать приглашение, если поля пустые, но все же, он записывает предоставленные данные, даже если один или несколько заполненных пустых.

Вот мой HTML код формы:

<script type='text/javascript'> 
function notEmpty(elem, helperMsg){ 
if(elem.value.length == 0){ 
    alert(helperMsg); 
    elem.focus(); 
    return false; 
} 
return true; 
} 

<form action="insert.php" method="post"> 
FNAME: <input type="text" name="fname" maxlength="50" id="required"/> 
MNAME: <input type="text" name="mname" maxlength="50" id="required"/> 
LNAME: <input type="text" name="lname" maxlength="50" id="required"/><br/> 

Male <input type="radio" name="gender" value="male" /><br/> 
Female <input type="radio" name="gender" value="female" /><br/> 

College: 
<select name="college"> 
<option value="default"> --- </option> 
<option value="CEC">CEC</option> 
<option value="CAD">CAD</option> 
<option value="COB">COB</option> 
</select> 
</br> 

<input type="submit" name="formSubmit" onclick="notEmpty(document.getElementById('required'), 'Please Enter a Value')" 
value='SUBMIT'/> 
</form> 

мой PHP код:

<?php 

$con = mysql_connect("localhost","abs","abs"); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("testdb", $con); 

$sql="INSERT INTO name (fname, mname, lname, gender, college) 
VALUES 
('$_POST[fname]','$_POST[mname]','$_POST[lname]','$_POST[gender]','$_POST[college]')"; 

if (!mysql_query($sql,$con)) 
    { 
    die('Error: ' . mysql_error()); 
    } 

echo "1 record added"; 

mysql_close($con) 
?> 

Я не могу заставить его работать. Я новичок в php. пожалуйста помогите. Большое спасибо !!

Answer 1

Что-то не так в вашем коде. Вы передаете идентификатор одного элемента и хотите проверить все элементы. Идентификатор всех полей одинаковый.

Предложив вам ссылку: http://www.javascriptkit.com/script/script2/formrequired.shtml

показывая живой пример того, что вы хотите. Вы можете взять код отсюда и попробовать.

Answer 2

Ваша функция возвращает значение, но вы его не используете.

onclick="return notEmpty(...

Ложное возвращаемое значение остановит представить.

По этой причине форма по-прежнему отправляется на бэкэнд.

Кроме того, id всегда должен быть уникальным. Использование getElementById вернет вам только один элемент, поэтому вы не проверяете все необходимые поля. Вместо этого вы можете назначить класс требуемых и цикл над элементами.