使用 jquery 在模态上填写必填字段

Question

我在模态弹出窗口中动态填充一些文本框，提交表单时我需要检查必填字段是否已填写。

我尝试了两种方法，但都不起作用..

如果你想检查这里是完整的代码 http://jsfiddle.net/nsk21/f52nLfrj/

这是如何尝试1：

 $(document).on('click', '#catSave', function(){
    var countValid = 0 ;
    totRequFileds = 0;

    $('#catCreatForm').find('input').each(function(){
        alert($(this).attr('type'));
        if(!$(this).prop('required')){
            if ( this.value.trim() !== '' ) {                           
                countValid++;                                           
            }else{      
                $(this).focus();
                return false;
            }
            totRequFileds++; 
        } else {

        }
    });       
    alert(' totRequFileds:'+totRequFileds +' | '+countValid);
});

尝试 2：

      $( ':input[required]', '#catCreatForm' ).each( function () {
            alert($(this).attr('name'));
            if ( this.value.trim() !== '' ) {                           
                countValid++;                                           
            }else{      
                $(this).focus();
                return false;
            }
            totRequFileds++; 
        }); 

Answer 1

你可能没有注释掉小提琴中的那些行，我已经稍微改变了这些行

$(document).on('click', '#catSave', function(){
	var countValid = 0 ;
	totRequFileds = 0;
	$( ':input[required]', '#catCreatForm' ).each( function () {
		totRequFileds++;
		alert($(this).attr('name'));
		if ( this.value.trim() !== '' ) {							
			countValid++;											
		}else{		
			$(this).focus();
			//return false;
		}
	});
	if( countValid != totRequFileds){
		alert('Please fill out all required fileds totRequFileds:'+totRequFileds +' | '+countValid);
      return false;
	}
    alert(' totRequFileds: '+totRequFileds +' | '+countValid);
});