如何将选定的值传递给复选框表中的后端

时间:2015-12-03 10:56:14

标签: jquery django checkbox

我有一个带复选框的html表,我想将所选复选框的值传递回我的视图。

我的html表:

<table class="demo-add-niftycheck" data-toggle="table" data-toolbar="#demo-delete-row" data-search="true" data-show-refresh="true" data-show-toggle="true" data-show-columns="true" data-sort-name="id" data-page-list="[25, 50, 100]" data-page-size="25" data-pagination="true" data-show-pagination-switch="true">
    <thead>
        <tr>
            <th data-checkbox="true">Order ID</th>
            <th data-align="center" data-sortable="true">Order ID</th>
            <th data-align="center" data-sortable="true">Channel</th>
            <th data-align="center" data-sortable="true">Dispatch By Date</th>
            <th data-align="center" data-sortable="true">Order Amount</th>
            <th data-align="center" data-sortable="true">Status</th>
            <th data-align="center" data-sortable="true">Product</th>
        </tr>
    </thead>
    <tbody>
        {% for oid,oiid,dbd,stts,tp,sku,qty,chnl in new_orders %}
        <tr>
            <td><input name="order_id_1" value="{{oid}}" style="display:none"></td>
            <td>
                <div><input name="order_id" value="{{oid}}" style="display:none">{{oid}}</div>
                <div><input name="order_item_id" value="{{oiid}}" style="display:none">{{oiid}}</div>
            </td>
            <td><input name="channel" value="{{chnl}}" style="display:none">{{chnl}}</td>
            <td>{{dbd}}</td>
            <td>{{tp}}</td>
            .....

我想将{{oid}},{{oiid}},{{chnl}}的值传递回我的django视图。 问题是当我选择一些行时,所有行的数据都会传回我的视图。如何解决这个问题?

demo-add-niftcheck(表类):

$(".demo-add-niftycheck").on('post-body.bs.table', function () {
    $(this).find('input:checkbox').not('.form-checkbox input:checkbox').wrap('<label class="form-checkbox form-icon"></label>');
    $(this).find('.form-checkbox').niftyCheck();
});

我可以在我的后端捕获数据,如:

order_id_list = request.POST.getlist['order_id']
order_item_id_list = request.POST.getlist['order_item_id']

表jquery:

var $table = $('#demo-custom-toolbar'), $remove = $('#demo-delete-row');

    $table.on('check.bs.table uncheck.bs.table check-all.bs.table uncheck-all.bs.table', function () {
        $remove.prop('disabled', !$table.bootstrapTable('getSelections').length);
    });

    $remove.click(function () {
        var ids = $.map($table.bootstrapTable('getSelections'), function (row) {
            return row.id
        });
        $table.bootstrapTable('remove', {
            field: 'id',
            values: ids
        });
        $remove.prop('disabled', true);
    });


});

编辑:

我也无法在第一列中传递任何值。即带有复选框的列。我从互联网上获取了这些代码,所以我不知道幕后发生了什么。

data-toggle属性:

a.fn.bootstrapTable=function(b,c){
var d;return this.each(function(){
    var e=a(this),f=e.data("bootstrap.table"),g=a.extend({},h.DEFAULTS,e.data(),"object"==typeof b&&b);if("string"==typeof b){if(a.inArray(b,i)<0)throw"Unknown method: "+b;if(!f)return;d=f[b](c),"destroy"===b&&e.removeData("bootstrap.table")}f||e.data("bootstrap.table",f=new h(this,g))}),"undefined"==typeof d?this:d
},
a.fn.bootstrapTable.Constructor=h,a.fn.bootstrapTable.defaults=h.DEFAULTS,a.fn.bootstrapTable.columnDefaults=h.COLUMN_DEFAULTS,a.fn.bootstrapTable.locales=h.LOCALES,a.fn.bootstrapTable.methods=i,a(function(){
a('[data-toggle="table"]').bootstrapTable()
})

0 个答案:

没有答案