jquery - 从数据表中获取隐藏行内容并将其与表单一起提交

Question

我遇到了一个问题，现在它占用了我的时间。我有一个包含 7 条记录的表(例如)，该表具有 input 和 textarea 元素，用户可以在其中输入内容。现在，分页的值为每页 5 条记录，我有两个页面。用户在评论部分输入数据，单击分页中的“下一步”，然后在评论部分输入值。因此从技术上讲，用户将值输入到由数据表分页逻辑分割的两个页面中。问题是，当用户点击“保存”时，它只保存那些焦点集中的元素，更容易理解页面上可见的元素。我阅读了 API 和常见问题解答，很明显，数据表隐藏了不在焦点中的元素，使得它们几乎不可能在 DOM 中找到。下面是代码，我需要帮助了解如何使用 fnGetHiddenTrNodes() 方法从隐藏行获取数据，创建隐藏元素并将它们附加到现有的可见表元素，然后再提交表单。我尝试了下面的代码，但它不起作用。

    $("#form").on("submit",function(){
       if($("#form").valid()){

           var nNodes = oTable.fnGetHiddenTrNodes();
           for ( var i=0 ; i<nNodes.length ; i++ )
           {
               var nHidden = document.createElement( 'input' );
               nHidden.type = 'hidden';
               nHidden.name = "hidden_input_"+i;
               nHidden.value = $('input', nNodes).val();

               //alert(nHidden.value);
               this.appendChild( nHidden );
           }

           $("#form").submit();   


       }else {
           validator.focusInvalid();
           return false;
       }

   });

非常感谢任何帮助。

Answer 1

$("#form").on("submit",function(){
    if($("#form").valid()){

       //Loop through the TR records
       oTable.$("tr").each(function(index, nRow){
            //Select the input from the row
            //var rowInput = $("input", nRow);
            //Select the text area from the row
            //var rowTextarea = $("textarea", nRow);

            //Add to form
            var nHidden = document.createElement( 'input' );
            nHidden.type = 'hidden';
            nHidden.name = "hidden_input_"+index;

            //Assuming there is one input per row
            nHidden.value = $("input", nRow).val();
            //alert(nHidden.value);
            $("#form").append( nHidden );
        });

        $("#form").submit();         
    }else {
        validator.focusInvalid();
        return false; 
    }    
});