将上传文件按钮添加到数据表按钮

时间:2016-07-28 02:20:21

标签: javascript jquery datatables

所以我想制作一个充当文件浏览器或文件输入的按钮,在我选择文件后,它会将这些文件提交到表单中。我试图创建它只会javascript包括创建按钮,因为这个按钮是数据表的扩展名。

到目前为止,我已经可以将按钮作为文件输入,但不能让它提交onchange ...甚至认为我已经将整个表放在表单标签中...

任何想法怎么做?

注意:我正在使用jquery数据表来创建按钮......这里有一些参考资料 datatables button extension

new $.fn.dataTable.Buttons(table,{
    buttons: [
        {
            text: '<i class="fa fa-upload"></i> Import File',
            action: function(){
                var fileSelector = $('<input type="file" name="import_file" onchange="this.form.submit();">');
                fileSelector.click();
                return false;
            }
        }
    ]
});

更新

这是我的html结构...我正在使用laravel,因此表单是使用刀片模板生成的......但它仍然是一个正常形式,但为了安全目的而带有一点标记......

{{ Form::open(array('route' => array('admins.'.$kelas.'.importexcel'),'files' => true)) }}
<table class="table table-striped table-hover" id="dataTables-example">
    <thead>
    <tr>
        // table heading
    </tr>
    </thead>
    <tbody>
        // table content
    </tbody>
</table>
{{ Form::close() }}

1 个答案:

答案 0 :(得分:0)

这表明输入是表单。您需要定位父元素。如果表单之外没有父级,请从以下位置更改onchange事件:

 onchange="this.form.submit();"

为:

 onchange="this.parentNode.form.submit();"

目前你说文件输入是表格