我有一个我正在创建的程序,可以动态创建任务输入。我的问题是我正在尝试在表单提交上创建一些验证来检查可能出错的任何内容。
我遇到了循环遍历类的问题。我认为主要问题是“if”验证。
以下是我现在的代码:
function(){
//some validation for the tasks....Loop through page create an instance of the message.
var numOfTaskName = $('.taskNameInput').length
alert(numOfTaskName);
var i=0;
while (i<=numOfTaskName)
{
if($(".taskNameInput").val()=="Task Name" || $(".taskNameInput").val().length <1)
{
$("#message").html("<div class='errors'>At least one task is required. This error will show if you have not entered at least one task or you have an extra task that is not needed on the task tab. Please add a task or delete the extra task.</div>");
i++;
return false;
} i++;
}
编辑:哦,顺便说一下,这个验证实际上适用于第一堂课。但不适用于任何其他动态创建的任务(类)。
另一个编辑
好吧......我遇到的问题是将此循环嵌套在我的提交函数中。请参阅下面的我的提交功能。在提交时,我需要验证所有“taskNameInput”类。
$("form").submit(
function(){
$.blockUI({ message: 'Processing...please wait.',
css: {
border: 'none',
padding: '15px',
backgroundColor: '#000',
'border-radius': '10px',
'-webkit-border-radius': '10px',
'-moz-border-radius': '10px',
opacity: .5,
color: '#fff'
}});
$.post("projectSetupCB.php",
$("#newProject").serialize(),
function(list){
$("#message").removeClass().html(list);
$("html,body").animate({scrollTop:0},'slow');
$.unblockUI()
});
return false;
});
答案 0 :(得分:2)
在循环中使用$(".taskNameInput")
时,每次都会获得相同的第一个对象。您应该使用.each()
来迭代$(".taskNameInput")
中的所有项,并在您想要停止迭代时从每个函数返回false。
function(){
$('.taskNameInput').each(function() {
var o = $(this);
if (o.val() == "Task Name" || o.val().length < 1) {
$("#message").html("<div class='errors'>At least one task is required. This error will show if you have not entered at least one task or you have an extra task that is not needed on the task tab. Please add a task or delete the extra task.</div>");
return(false); // break out of .each() loop
}
});
要在提交函数中使用它,您可能希望首先使其成为可以调用的提交函数中的本地函数。然后,在提交函数中,您可以调用它并对其返回值进行操作:
$("form").submit(function() {
// declare local function for validation
function validateInputs() {
var ok = true;
$('.taskNameInput').each(function() {
var o = $(this);
if (o.val() == "Task Name" || o.val().length < 1) {
$("#message").html("<div class='errors'>At least one task is required. This error will show if you have not entered at least one task or you have an extra task that is not needed on the task tab. Please add a task or delete the extra task.</div>");
ok = false; // set return flag
return(false); // break out of .each() loop
}
});
return(ok);
}
// block the UI
$.blockUI({
message: 'Processing...please wait.',
css: {
border: 'none',
padding: '15px',
backgroundColor: '#000',
'border-radius': '10px',
'-webkit-border-radius': '10px',
'-moz-border-radius': '10px',
opacity: .5,
color: '#fff'
}
});
// now validate the input and return false if it doesn't validate
if (!validateInputs()) {
$.unblockUI();
return(false);
}
// send our form data
$.post("projectSetupCB.php",
$("#newProject").serialize(),
function(list) {
$("#message").removeClass().html(list);
$("html,body").animate({scrollTop:0},'slow');
$.unblockUI();
}
);
return(false); // we already posted, don't let the form post itself
});
答案 1 :(得分:0)
米奇,
首先,为什么不使用Jquery来循环输入,更清晰。
其次,如果您有多个使用类taskNameInput的输入,则可能使用jquery选择器错误来查找输入的值。发布你的html代码也许有帮助,这样我们就可以看到你如何构建你的类和ID。
$('.taskNameInput').each(function(){
var $this = $(this);
if($this.val()=="Task Name" || $this.val().length < 1)
{
$("#message").html("<div class='errors'>At least one task is required. This error will show if you have not entered at least one task or you have an extra task that is not needed on the task tab. Please add a task or delete the extra task.</div>");
}
});