Datatables - fnGetNodes() 如何将结果推送回服务器 [英] Datatables - fnGetNodes() how to push the results back to the server

问题描述

我一直在努力使用 datatables 以及如何正确处理 fnGetNodes提交时将数据推回到表单中.

I've been struggling with with datatables and what to do with fnGetNodes to correctly push the data back into the form on submit.

我已经让 jquery 正常工作了.我可以看到文档中所述的选定值.我的问题是如何获取 sData 并在 POST 中将其推送回服务器??

I've got the jquery working correctly. I can see the selected values as described in the documentation. My question is how do I take that sData and shove that back to the server in the POST??

我知道这一定很简单，但我显然太专注于树而看不到森林..我很感激这方面的任何帮助！！

I know it must be simple but I am clearly too focused on the tree to see the forest.. I'd appreciate any help on this!!

<script style="text/javascript">

    $(document).ready(function() {
        $('#form').submit( function() {
            var sData = $('input', oTable.fnGetNodes()).serialize();
            alert( "The following data would have been submitted to the server: 

"+sData );
            return false;
        });

        oTable = $('#data_table').dataTable();
    });
</script>

我的 HTML 表单看起来像这样(为了清楚起见缩短了)

My HTML form looks like this (Shortened for clarity)

<table id="data_table">
            <thead>
                <tr>
                    <th>Select</th>
                    <th>Question</th>
                </tr>
            </thead>
            <tr id=0><td><label for="id_questions_0"><input type="checkbox" name="questions" value="103" id="id_questions_0" /></label></td><td>D1. Example of a multiple choice question</td></tr>
<tr id=1><td><label for="id_questions_1"><input type="checkbox" name="questions" value="104" id="id_questions_1" /></label></td><td>E1. Example of a multiple choice question</td></tr>
<tr id=2><td><label for="id_questions_2"><input type="checkbox" name="questions" value="105" id="id_questions_2" /></label></td><td>G. Example of a multiple choice question</td></tr>
<tr id=3><td><label for="id_questions_3"><input type="checkbox" name="questions" value="106" id="id_questions_3" /></label></td><td>H. Example of a multiple choice question</td></tr>

编辑

警报向我展示了这一点.questions=103&questions=104&questions=105&questions=106&questions=100&questions=101&questions=102

The alert is showing me this. questions=103&questions=104&questions=105&questions=106&questions=100&questions=101&questions=102

和 POST(使用开发人员工具(正在向我展示这一点.

And the POST (Using the developer tools( is showing me this.

csrfmiddlewaretoken:a2c3ed6e1bfee9fce0b7412553aa2080
name:Phase-1 Pre-Drywall
priority:1
description:Pre-Drywall inspection items
use_for_confirmed_rating:on
use_for_sampling:on
data_table_length:10
questions:103
questions:104
questions:105
questions:106
submit:Submit

所以不知何故我需要使用 jquery 将前者转换为后者有人可以帮我吗.

So somehow I need to transform the former into the later using jquery Can someone help me with this.

谢谢

推荐答案

结果(如预期)非常简单.

The answer turned out (as expected) to be very simple.

        var oTable = $('#data_table').dataTable();
        // This will collect all of the nodes which were checked and make sure they get
        // pushed back.
        $('#form').submit(function () {
            $("input[name='question']").remove();  //Remove the old values
            $("input:checked", oTable.fnGetNodes()).each(function(){
                $('<input type="checkbox" name="questions" ' + 'value="' +
                  $(this).val() + '" type="hidden" checked="checked" />')
                    .css("display", "none")
                    .appendTo('#form');
            });
        });

这篇关于Datatables - fnGetNodes() 如何将结果推送回服务器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！