提交前的JSP表单验证

Question

在JSP页面中，我有两个下拉列表，一个用于投资组合代码，另一个用于价目表代码。

查询：当JSP页面加载时，即使没有选择位于顶部的投资组合代码的值，它总是显示价目表代码的警告消息，＆＃34;请选择RateCardCode＆＃34;点击＆＃34;保存更改＆＃34;按钮。这意味着始终显示函数中的最后一个操作而不是第一个操作。

<div class="form-group"> 
    <label for="rateCardCode">RateCardCode</label> 
    <select id="rateCardCode" name="rateCardCode" class="form-control" onchange="bindCode()">   <option value = null label="--SELECT--"> <c:forEach items="${rateCardCodes}" var="rateCardCodes"> <option value="${rateCardCodes.rateCardCode }">${rateCardCodes.rateCardCode}</option> </c:forEach> 
    </select> 
    <!-- <input type="hidden" id="rateCardCode" name="rateCardCode"> --> 
</div >
<button type="submit" class="btn btn-primary" onclick="return validateSearchFields()">
    Save Changes
</button>

在提交表单之前，我要验证是否选择了null，不应提交表单，并使用以下代码显示警告消息：

function validateSearchFields() {
    var value = $('#portfolioCode').val();
    if (value == null || value == "")
    {
        alert("Please select Portfolio Name");
        return false;
    }
    value = $('#rateCardCodes').val();
    if (value == null || value == "")
    {
        alert("Please select RateCardCode");
        return false;
    }
    return true;
} 

请帮助我，它应首先显示投资组合代码，然后显示价目表代码。