Question

我有一个有几行的表。行是动态创建的，并已从javascript中删除。因此，删除按钮确实可以。

    $("#TaskTableBody").on('click','.removeSchedule',function(){
        $(this).closest("tr").remove();
    });

因此，我有一个提交按钮，可用于将表单对象重定向到服务器上的验证。

问题是，当我删除行时，ui可以正常工作，但发送到验证的对象具有已删除的所有行，都带有空值。

$("#validatePlan").click(function(e){

    e.preventDefault();
    var ScheduleForm=$("#form2").serializeArray();       
    sessionStorage.setItem("schedForm",JSON.stringify(ScheduleForm));   
    sessionStorage.setItem("flag","set");

    $("#form2").attr('action',"/TaskSchedulePlanValidation/");
    $("#form2").submit();
});

我将表单存储到sessionStorage中，以便在验证后重新加载它。重新加载工作正常，并且不会显示以前已删除的具有空值的行，但是Submit对象仍然具有这些行。

html部分是：

<form th:action="@{/saveSchedule/}" th:object="${plan}" id="form2" method="post">   
    <div >
        <div >
            <h3 class="plan-header"> Schedule Table</h3>
            <button type="submit" th:formaction="@{/TaskSchedulePlanValidation/" form="form2" id="validatePlan">
            <span class="glyphicon glyphicon-list-alt"> Validate Plan</span> 
            </button>                       
        </div>
        <div id="planDiv">
            <table id="planTable" class="pre-scrollable">
                <thead>
                    <tr>
                        <th>Planned Date</th>
                        <th>Planned Quantity</th>
                        <th><button type="button" class="btn btn-success btn-circle-sm" id="addRow"><span class="glyphicon glyphicon-plus"></span></button></th>
                        <th>Completed Quantity</th>

                    </tr>
                </thead>
                <tbody id="scheduledTaskTableBody">
                    <tr th:each="schedule, iter : ${TaskPlan.ScheduleList}">
                        <td class="ScheduledPlannedDate"><input type="text" class="datepickerSchedule ScheduledPlannedDateInput" th:name="ScheduleList[__${iter.index}__].plannedDate" th:value="${schedule.plannedDate}"></td>
                        <td class="ScheduledQty"><input type="number" class="ScheduledTaskQtyInput" th:name="ScheduleList[__${iter.index}__].plannedQty" min="0" step="0.1" th:value="${#numbers.formatDecimal(schedule.plannedQty,1,'COMMA',1,'POINT')}"></td>
                        <td><button type="button" class="removeSchedule btn btn-danger btn-circle-sm"><span class=" glyphicon glyphicon-remove"></span></button></td>
                        <td class="ScheduledCompletedQuantity"><input type="number" class="scheduledTaskInput ScheduledTaskCompletedQuantity ScheduledTaskCompletedQtyInput" th:name="ScheduleList[__${iter.index}__].completedQty" min="0" step="0.1" th:value="${#numbers.formatDecimal(schedule.completedQty,1,1,'POINT')}"></td>                    
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="submitClearButtonsForm2Div">
            <button type="submit" class="btn btn-success" id="SubmitScheduleDistButton" form="form2"><i>Submit</i></button>
            <button type="reset" class="btn btn-danger" id="ClearScheduleDistButton" form="form2"><i>Clear</i></button>
        </div>
    </div>      
</form>

我可以说form.serialiseArray（）给出了正确的行列表，但是正常的提交具有所有内容（我是指已删除的行，并且该行内的对象设置为null）

表格行中的.remove（）会在Submit

0 个答案: