Ошибка проверки JavaScript с Django

Question

У меня есть опция фильтрации в моем приложении Django.Фильтрация выполняется по выбору (имя, местоположение, обозначение, EmployeeID и т. Д.), Выбранному в раскрывающемся списке, и по значению, введенному в текстовое поле.Теперь я хотел проверить, когда пользователь выбирает EmployeeID из выпадающего списка. Если при выборе EmployeeID не было введено никакого значения в текстовом поле, форма не должна быть отправлена, и должно быть показано предупреждение для ввода некоторого текста.Я создал функцию js для проверки того, что поле пустое или нет, но оно работает не так, как я хотел.Я вставлю свой код сюда.

<form name="myform" id="myformid"  method="POST" >

    Filter By: 
    <select name="choices" id ="choicesId"  style="color: black; background-color: #BDBDBD" >

        <option value="Name">Name</option> 
        <option value="Designation" >Designation</option>
        <option value="EmployeeID" id="empid">EmployeeID</option>
        <option value="Project" >Project</option>
        <option value="DateOfJoin" >Date Of Join</option>
        <option value="location" >Location</option>
        <option value="email">Email</option>    
        <option value="skills">Skills</option>
    </select>
    <input id="textField "type="text" name="textField" style="color: black; background-color: #BDBDBD" >
    <input type="button" value="Go" onclick="isEmpty();">
    </form>

    <table id="employeeTable" class="tablesorter">
    <thead><tr><th>Employee List <!-- <input type="image" src="/static/sort_asc.gif " height="12" name="sortAscend"> --> </th></tr></thead> <br>
    <tbody>
    {%for emp in emp_list.object_list%}
        <tr> 
            <td><a STYLE="text-decoration:none" href ="http://10.1.0.90:8080/singleEmployee/{{emp.id}} "> {{ emp.userName }} </a></td>
         </tr>
    {%endfor%}
    </tbody>
    </table></h4>
    </div><br><br>
    <a STYLE="text-decoration:none" href="http://10.1.0.90:8080/createEmployee/ ">Create New Employee </a>

    <script type="text/javascript">
    function isEmpty(){
        if ((document.myform.choices.selectedIndex.value=='')) 

            {
            alert(document.myform.choices.options[document.myform.choices.selectedIndex].id);
            alert("Hi");
            document.myform.choices.focus();
            /*document.getElementById('employeeIDfield').innerHTML = 'Please fill this field';*/
            return true;
            }
        else 
            { 
            alert("Data entered");
            document.getElementById('myformid').action = "http://10.1.0.90:8080/filter/";
            document.getElementById('myformid').submit(); 
            return false; 
            }
    }
    </script>

Что я мог понять, так это то, что форма все еще отправляется даже после входа в функцию javascript.Условие else работает для всего процесса.Может кто-нибудь разобраться в этой проблеме и дать мне решение?Пожалуйста, оставьте комментарий для большей ясности, которую я должен дать.Любая помощь будет оценена

Answer 1

проверил ваш код, и если я правильно понимаю вашу проблему, вы хотите сделать это:

<form name="myform" id="myformid"  method="POST" action="http://10.1.0.90:8080/filter/" onSubmit="javascript:return isEmpty();" >

Filter By: 
<select name="choices" id ="choicesId"  style="color: black; background-color: #BDBDBD" >

    <option value="Name">Name</option> 
    <option value="Designation" >Designation</option>
    <option value="EmployeeID" id="empid">EmployeeID</option>
    <option value="Project" >Project</option>
    <option value="DateOfJoin" >Date Of Join</option>
    <option value="location" >Location</option>
    <option value="email">Email</option>    
    <option value="skills">Skills</option>
</select>
<input id="textField" type="text" name="textField" style="color: black; background-color: #BDBDBD" value="" / >
<input type="submit" value="Go"/>
</form>

<table id="employeeTable" class="tablesorter">
<thead><tr><th>Employee List <!-- <input type="image" src="/static/sort_asc.gif " height="12" name="sortAscend"> --> </th></tr></thead> <br>
<tbody>
{%for emp in emp_list.object_list%}
    <tr> 
        <td><a STYLE="text-decoration:none" href ="http://10.1.0.90:8080/singleEmployee/{{emp.id}} "> {{ emp.userName }} </a></td>
     </tr>
{%endfor%}
</tbody>
</table></h4>
</div><br><br>
<a STYLE="text-decoration:none" href="http://10.1.0.90:8080/createEmployee/ ">Create New Employee </a>

<script type="text/javascript">
function isEmpty(){
    var my_select = document.myform.choices;
    var selected_index = my_select.selectedIndex;
    var my_textfield = document.getElementById('textField');
    if ((my_select[selected_index].value == 'EmployeeID')  && ((my_textfield.value=='') || (my_textfield.value==null))) {
        alert("Enter employee ID!");
        my_textfield.focus();
        return false;
    }
    else{ 
        alert("Data entered");
        return true; 
    }
}
</script>