与引导文件JQuery验证上传

Question

喜林很新的编程，我希望能帮助我解决这个问题：

我试图表明一个弹出提交我的表单和输入类型的文件是空当，但是这并未”工作，我使用引导2.3.1和jQuery验证插件1.11.1，与其他控件工作正常。

我的javascript：

$("#ARCHIVO").rules("add", { required: true, messages: { required: "Campo obligatorio" }, accept: "*/pdf" }); 

我的html：

<div class="control-group"> 
<label class="control-label">Archivo</label> 
<div class="controls"> 
    <div class="fileupload fileupload-new" data-provides="fileupload" id="frmUpload"> 
     <div class="input-append"> 
      <div class="uneditable-input span9"> 
       <i class="icon-file fileupload-exists"></i><span class="fileupload-preview"></span> 
      </div> 
      <span class="btn btn-file"><span class="fileupload-new"><i class="icon-search"></i></span><span class="fileupload-exists"><i class="icon-refresh"></i></span> 
       <input name="ARCHIVO" id="ARCHIVO" type="file" style="z-index: 9999" /></span><a href="#" class="btn fileupload-exists" data-dismiss="fileupload"><i class="icon-remove"></i></a> 
     </div> 
    </div> 
</div> 

Answer 1

假设是在OP您的完整代码。

1）您需要将您的数据输入元素放在<form>容器的的内部。

<form id="myform"> 
    .... 
</form> 

2）之前，你可以使用.rules()方法动态添加规则，则需要使用.validate()方法来初始化表单上的插件。

$('#myform').validate(); 

然而，在这种情况下，你不会需要.rules()方法，因为你可能不需要动态添加规则。 ...只要申报的规则在.validate()方法

$('#myform').validate({ 
    rules: { 
     ARCHIVO: { 
      required: true, 
      accept: "*/pdf" 
     } 
    }, 
    messages: { 
     ARCHIVO: { 
      required: "Campo obligatorio" 
     } 
    } 
}); 

3）您使用的是accept方法/规则，所以你要记住，the additional-methods.js file？

4）你没有显示它，所以我会采取任何理所当然。当调用jQuery时，确保页面准备就绪是个好主意。把你的jQuery放入一个DOM准备好的事件处理程序中。

$(document).ready(function() { 

    $('#myform').validate({ 
     ..... 
    }); 

});