3

我被一个问题困住了，它现在占用了我的时间。我有一个包含 7 条记录的表（例如），该表有 input 和 textarea 元素，用户可以在其中输入。现在分页的值为每页 5 条记录，我有两页。用户在评论部分输入数据，点击分页中的“下一步”并在评论部分输入值。因此，从技术上讲，用户将值输入到两个页面中，并按数据表分页逻辑进行拆分。问题是，当用户点击保存时，它只保存那些在焦点上的元素，更容易理解在页面上可见的元素。我阅读了 API 和常见问题解答，很明显 datatable 隐藏了不在焦点的元素，使得它们几乎无法在 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;
       }

   });

任何帮助是极大的赞赏。

4

2 回答 2

2 
$("#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; 
    }    
});
于 2013-03-21T18:54:33.500 回答
1

好吧。！是时候结束了。感谢@Bret 给我一个方向。下面是最终工作的代码片段 -

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

            var nNodes = oTable.fnGetHiddenTrNodes();

                    $('td', nNodes).each(function(index,ncolumn) {

                        var nHidden = document.createElement( 'input' );
                        nHidden.type = 'hidden';
                        nHidden.name = $("input", ncolumn).attr("name");
                        nHidden.value = $("input", ncolumn).val();

                        if(typeof(nHidden.name)  != "undefined")
                        $("#form").append( nHidden );

                        nHidden = document.createElement( 'input' );
                        nHidden.type = 'hidden';
                        nHidden.name = $("textarea", ncolumn).attr("name");
                        nHidden.value = $("textarea", ncolumn).val();

                        if(typeof(nHidden.name)  != "undefined")
                        $("#form").append( nHidden );

                        nHidden = document.createElement( 'input' );
                        nHidden.type = 'hidden';
                        nHidden.name = $("textarea", ncolumn).attr("name");
                        nHidden.value = $("textarea", ncolumn).val();

                        if(typeof(nHidden.name)  != "undefined")
                        $("#form").append( nHidden );

                        nHidden = document.createElement( 'input' );
                        nHidden.type = 'hidden';
                        nHidden.name = $("select", ncolumn).attr("name");
                        nHidden.value = $("select", ncolumn).attr("value");

                        if(typeof(nHidden.name)  != "undefined")
                        $("#form").append( nHidden );

                    });

            clickedSave = true;


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

    });

谢谢。

于 2013-03-21T20:45:29.050 回答