php - 如果表单中的值为空，如何显示警告消息

Question

我在脚本中有一个表单( Bootstrap )，如果用户没有选择语言并且值“”为空白以显示警告消息并且他必须选择一种语言才能继续下一步，则需要它. (如您所见，表单中的空值:值“”表示“选择语言”)

我正在使用谷歌小部件工具的那种形式进行翻译，当访问者没有点击任何东西并继续将文件保存到数据库中时，在数据库中我得到值:“选择语言”，我需要他们选择一种下拉菜单中的语言。

这是表单代码:

<div class="form-group">
  <label for="recipient-name" class="col-form-label">Language:</label>
  <input type="text" class="form-control langinput" id="country" value="" readonly>
  <select class="form-control langselect" aria-label="Language Translate Widget" id="country" style="display: none">
    <option value="">Select Language</option>
    <option value="English">English</option>
    <option value="Afrikaans">Afrikaans</option>
    <option value="Albanian">Albanian</option>
    <option value="Amharic">Amharic</option>
    <option value="Arabic">Arabic</option>

这里是保存文件到数据库的按钮代码:

<button style="margin-top: -5%" background-color="#357ae8" type="button" class="btn btn-success" data-toggle="modal" data-target="#exampleModal" data-whatever="@getbootstrap" onclick="lang1()">Save to Database</button>

lang1 函数:

        var langPath = $("select.goog-te-combo option:selected").text();
        /*document.getElementById("country").options[document.getElementById("country").selectedIndex].text = langPath;
        document.getElementById("country").options[document.getElementById("country").selectedIndex].value = langPath;*/
        document.getElementById("country").value = langPath;
        //$(".langinput").value = langPath;
        //$('input[type="text"][class="langinput"]').prop("value", "langPath");
        //$('.langinput').text(langPath);
        $('.langinput').attr('value', langPath);
        //$(".langinput").display = "inline";

    }
    /*function stoppedTyping(){
        if($('#subtitle').val().length > 1 && $('#country').val().length >0 ) {
            document.getElementById('submit_button').disabled = false;
        } else {
            document.getElementById('submit_button').disabled = true;
        }
    }
    function stoppedSelect(){
        if($('#subtitle').val().length > 1 && $('#country').val().length >0 ) {
            document.getElementById('submit_button').disabled = false;
        } else {
            document.getElementById('submit_button').disabled = true;
        }
    }*/

Answer 1

使用 bootstrap 只需将 required 添加到选择中:

<select class="form-control langselect" aria-label="Language Translate Widget" id="country" style="display: none" required>
    <option value="">Select Language</option>
    <option value="English">English</option>
    <option value="Afrikaans">Afrikaans</option>
    <option value="Albanian">Albanian</option>
    <option value="Amharic">Amharic</option>
    <option value="Arabic">Arabic</option>
</select>

编辑

将按钮 onclick 更改为 onsubmit:

<button style="margin-top: -5%" background-color="#357ae8" type="button" class="btn btn-success" data-toggle="modal" data-target="#exampleModal" data-whatever="@getbootstrap" onsubmit="lang1()">Save to Database</button>