选择框下拉列表的Jquery验证

时间:2018-02-17 07:38:46

标签: jquery

我正在为表单使用jQuery验证。我正在尝试为表单中已存储的值添加验证。我有选择框下拉字段的表单,例如选择状态,选择城市,我有jQuery文件列出所有州和城市,我从中获取动态值到选择框下拉列表。

当我向文件I添加验证时,我没有获得下拉框的值。这是我的代码:

<form id="defaultForm" method="post" action="<?php echo site_url('Hotel/Updatehotel'); ?>" class="form-horizontal" enctype="multipart/form-data">
    <a href="#" class="add_page_button">Edit Hotel<span class="fa fa-plus"></span></a>
    <div class="clearfix"></div>
    <div class="box-content box">
        <input type="hidden" name="adminId" value="<?php echo $edithotel[0]->admin_id;?>">
                <div class="col-sm-3"></div>
                <div class="clearfix"></div>
                <div class="col-sm-3">
                <div id="selection">            
    <input type="hidden" name="selct_state" id="select_state" value="<?php echo $edithotel[0]->state; ?>">      
    <select class="selectBox form-control" name="state" id="listBox" onchange='selct_district(this.value)'>
    </select>
    </div>
    </div>
    <div class="col-sm-3">
    <input type="hidden" name="selct_city" id="select_city" value="<?php echo $edithotel[0]->city; ?>">
    <select class="selectBox form-control" id='secondlist' name="city">
    <option>Select City</option>
    </select>
  </div>
</form>

这是jQuery验证代码:

<script type="text/javascript">
$(function(){
    $("#defaultForm").validate({
        rules: {
            state:{
                required: true,

            },
            city:{
                required: true,

            },
            agree: "required"
        },
        messages: {
            state: "Please enter hotel name !",
            city: "Please enter branch name !", 
        }
    });
});
</script>

获取选择值的脚本:

<script type="text/javascript">
$( document ).ready(function() {
    var state =  document.getElementById('select_state').value;
    if(state){
        $('#listBox').val(state).attr('selected', true);             
    }           
    selct_district(state);
    setTimeout(sel_city, 0.1);
    sel_city();

});
</script>

<script type="text/javascript">
function sel_city(){
    var city =  document.getElementById('select_city').value;
    if(city){
        $('#secondlist').val(city).attr('selected', true);           
    }
}
</script>  

0 个答案:

没有答案