проверка правильности работы при добавлении новой строки?

Question

У меня есть таблица с каждой строкой, содержащая ссылку «удалить» и для всей таблицы add additional file link находится внизу таблицы.

Если вы нажмете add additional link, он добавит новую строку (например, метку (называемую файлом) и кнопку обзора и текстовое поле под названием description), но перед добавлением новой строки, когда вы нажимаете на ссылку добавления, сначала будет проверяться, будет ли каждое поле в строке получены требуемые значения или нет, если файл был загружен, а текст введен в текстовое поле description, то он добавит новую пустую строку, иначе он попросит ввести значения в полях.

Но моя проблема в том, что я добавляю две строки отлично, если я удалю первую строку, а затем, если дважды добавить дополнительную ссылку, она добавит две пустые строки, но это не должно. ТОЛЬКО ОДИН РЯД ДОЛЖЕН БЫТЬ ДОБАВЛЕН, ON ДОБАВЛЯЕТ ДОПОЛНИТЕЛЬНУЮ СВЯЗЬ И ЕСЛИ ВЫ НАЖМИТЕ НА ЭТО СНОВА, ТОГО, ЧТО ЭТО ДОЛЖНО УКАЗАТЬ ПОЛЯ, ЧТО ОНИ ОЗНАЧАЮТ ДЕЙСТВИТЕЛЬНЫЕ ЗНАЧЕНИЯ ИЛИ НЕ, ЕСЛИ ОНИ НЕ МОГУТ ТОЛЬКО ТОЛЬКО ТОЛЬКО ЭТО ДОЛЖНО ПОЗВОЛЯТЬ ПОЛЬЗОВАТЕЛЮ ДОБАВИТЬ НОВУЮ РУКУ НИЖЕ, ЧТО И ПРОЦЕСС ДОЛЖЕН ПРОХОДИТЬ SUCH.BUT, НЕ ДОЛЖНО ПОЗВОЛЯТЬ ПОЛЬЗОВАТЕЛЮ, чтобы ДОБАВИТЬ ДВЕ НОВЫЕ ПОРОЖНЫЕ.

Если последняя строка была заполнена надлежащими значениями, то следует добавить еще одну строку ... может кто-нибудь помочь мне в решении этой проблемы. Вот мой код идет:

<script type="text/javascript"> 
var addDiv = $('#listfiles'); 
var i = $('#addinput p').size() + 1; 
$('#addNew') 
.live(
    'click', 
    function(event) { 
     flag = true; 
     var row_len = $('#listfiles tr').length; 
     var cnt = parseInt($("#noOfFiles").val()); 
     cnt=row_len; 
     var targetId = $('#newfileid').val(); 

    var descrId = $('#newdescrid').val(); 

    var fileName = $("#" + targetId).val(); 
    var descrName = $("#" + descrId).val(); 
if(descrName == undefined) 
    { 
    descrName=""; 
    } 
    descrName = $.trim(descrName); 
    if (fileName != undefined) { 
    if (fileName.length == 0) { 
     $("#error").text("Please add a new file for browse button. 
     Remove file row if file isn't to be uploaded.").show(); 
$("#error").css("color", "red"); 
     event.preventDefault(); 
} else 

if (!(fileName.match(/\.(?:csv)$/))) { 

$("#error").text("Uploaded file(s) must be in CSV format. Please 
    upload a new file.").show(); 
$("#error").css("color", "red"); 
event.preventDefault(); 
} else if (descrName.length == 0|| descrName == '') { 
$("#error").text("Please add a new description for the File.").show(); 
$("#error").css("color", "red"); 
event.preventDefault(); 
} else { 
    alert("1st else"); 
$(
    '<tr class="filerow">' 
               + '<td width="265px">' 
               + '<span class="browse-text">File ' 
               + (cnt + 1) 
               + ':</span>' 
               + '<span class="browsebutton"> <input type="file" 
    id="addfile' + cnt + '" name="ivrsFiles[' + cnt + ']. 
    file" value="ivrsFiles[' + cnt + '].file"/><span class="description"> 
    <input type=text ></span></span>' 
               + '</td>' 
               + '<td>' 
               + 'Description:&nbsp;<input type="text" id="descr' + 
    cnt + '" name="ivrsFiles[' + cnt + '].fileDescription" value=""/>' 
               + '<td valign="middle"><a id="remNew1" name="remNew[' + cnt 
    + ']" href="#" class="delete-file">Delete file</a></td>' 
               + '</td>' + '</tr>') 
.appendTo(addDiv); 
$("#newfileid").attr("value",'addfile' + cnt); 
$("#newdescrid").attr("value",'descr' + cnt); 
cnt = cnt + 1; 
$("#noOfFiles").attr("value", cnt); 
    return false; 
} 
} else if (fileName == undefined) { 
     alert("2nd else"); 
    $(
    '<tr class="filerow">' 
              + '<td width="265px">' 
              + '<span class="browse-text">File ' 
              + (cnt + 1) 
              + ':</span>' 
              + ' <span class="browsebutton"><input type="file" id="addfile' + 
     cnt + '" name="ivrsFiles[' + cnt + '].file" value="ivrsFiles 
    [' + cnt + '].file"/><span class="description"><input type=text></span></span>' 
              + '</td>' 
              + '<td>' 
              + 'Description:&nbsp;<input type="text" id="descr' + cnt + '" 
    name="ivrsFiles[' + cnt + '].fileDescription" value=""/>' 
              + '<td valign="middle"><a id="remNew1" name="remNew[' + cnt + ']" 
    href="#" class="delete-file">Delete file</a></td>' 
              + '</td>' + '</tr>').appendTo(
addDiv); 
$("#newfileid").attr("value", 'addfile' + cnt); 
$("#newdescrid").attr("value", 'descr' + cnt); 
cnt = cnt + 1; 
$("#noOfFiles").attr("value", cnt); 
return false; 
    } 
     }); 

    $('#remNew1') 
     .live(
     'click', 
function() {  
var targetId = $('#newfileid').val(); 
var fileName = $("#" + targetId).val(); 
var cnt = parseInt($("#noOfFiles").val()); 
var agree = confirm("Are you sure? If you choose OK, This Template 
     will be Removed"); 
if (agree) { 
$(this).parent().parent().remove(); 
$('#listfiles tr').each(function (i) { 
var index = i + 1; 
$('td:first .browse-text', this).text('File ' + index + ':'); 
     }); 
somethingChanged = true; 
cnt = cnt - 1; 
    $("#noOfFiles").attr("value", cnt); 
if (fileName == undefined) { 
    window.location = "files_formulae.htm?projectId=" 
    + $ 
    (
    project.projectId 
    ) 
    ; 
    } 
} else 
    return false; 
    }); 

    }); 
</script> 
<body> 
<table class="filetable" cellpadding='8' cellspacing='5'id="listfiles"> 

<c:forEach var="ivrsFile" items="${project.ivrsFiles}"varStatus="status"> 
<tr id="filerow"> 
<td width='265px' ><span class="browse-text">File <c:out 
    value='${status.index + 1}' />:</span> 
<c:if test="${fn:length(ivrsFile.fileName) > 0}"> 
<form:input id="addFile${status.index}" 
path="ivrsFiles[${status.index}].fileName" readonly="readonly"/> 
<form:hidden path="ivrsFiles[${status.index}].fileID" /> 
</c:if> 
<c:if test="${fn:length(ivrsFile.fileName) <= 0}"> 
    <form:hidden path="ivrsFiles[${status.index}].fileName" /> 
<span class="browsebutton"> <input style="color: #F67D08" type="file" 
id="addFile${status.index}" 
name="ivrsFiles[${status.index}].file" 
value="ivrsFiles[${status.index}].file" /> 
    <span class="description"><input type=text></input></span></span> 
    <form:hidden path="ivrsFiles[${status.index}].fileID" /> 
    </c:if> 
</td> 
<td >Description: <form:input id="descr${status.index}" 
path="ivrsFiles[${status.index}].fileDescription" /></td> 

<td valign='middle'><c:if test="${ivrsFile.fileID ne 0 }"> 
<a id="remNew"href="files_delete.htm?delete=yes&projectId= 
    ${project.projectId}& fileID=${ivrsFile.fileID}" 
onclick="return confirmDelete('${project.projectId}');" 
class='delete-file'>Delete file</a> 
</c:if> <c:if test="${ivrsFile.fileID eq 0 }"> 
<a id="remNew1" href="#" class='delete-file'>Delete file</a> 
</c:if></td> 
</tr> 
</c:forEach> 
    </table> 
<a href="#" id="addNew" class='add-file'>Add additional file</a> 
</body> 

Answer 1

пытаются изменить это, потому что .live() осуждается:

$('#addNew').live('click',function(event) { 

к этому:

$(document).on('click', '#addNew', function(event) {