如果填充了第一个字段,则验证第二个字段

时间:2011-06-09 14:37:38

标签: jquery jquery-plugins jquery-validate

我有3个文件浏览器和每个文件输入类型的标签文本框。

<label>Photo 1</label>
<input type="file" size="10" name="service_field[15]" id="15" class="{accept:'jpg|jpeg|png|gif|bmp|tif',messages:{accept:'Only jpg,jpeg,gif,png,bmp,tif files are allowed.'}} file">
<label>Photo 1 Title</label>
<input type="text" name="service_field[576]" id="576" class="txt" value="">

<label>Photo 2</label>
<input type="file" size="10" name="service_field[578]" id="578" class="{accept:'jpg|jpeg|png|gif|bmp|tif',messages:{accept:'Only jpg,jpeg,gif,png,bmp,tif files are allowed.'}} file">  
<label>Photo 2 Title</label>
<input type="text" name="service_field[577]" id="577" class="txt" value="">

<label>Photo 3</label>
<input type="file" size="10" name="service_field[579]" id="579"  class="{accept:'jpg|jpeg|png|gif|bmp|tif',messages:{accept:'Only jpg,jpeg,gif,png,bmp,tif files are allowed.'}} file" >    
<label>Photo 3 Title</label>
<input type="text" name="service_field[580]" id="580" class="txt" value="">

我正在使用jquery验证器插件和jquery.metadata.js。

如果浏览文件,用户必须输入该文件的标签,我需要以这种方式验证这些输入。

1 个答案:

答案 0 :(得分:0)

你需要用这样的div包装每一个

<div>
   <label>Photo 1</label>
   <input type="file" size="10" name="service_field[15]" id="15" class="{accept:'jpg|jpeg|png|gif|bmp|tif',messages:{accept:'Only jpg,jpeg,gif,png,bmp,tif files are allowed.'}} file">
   <label>Photo 1 Title</label>
   <input type="text" name="service_field[576]" id="576" class="txt" value="">
</div>

然后你可以做

$('.txt').siblings('[type=file]').bind('change blur',function(){//if it changes or loses focus
     if($(this).val().length){
          $(this).siblings('.txt').show();
     }else{
          $(this).siblings('.txt').show();
     }
})
.blur();//this is so it can be trigger every time you load the page,, comment out if you wish

我应该提到......我没有使用过那个验证,所以给了你一个替代方案,它做了同样的事情:)