DataTable中的表单提交按钮在IE 11中不起作用(由于DataTable错误)

按钮将类型更改为button，并附加了onclick函数:<button type="button" url="{% url 'copyProcess' %}" onClick="copyIE(this,{{proc.id}})" class="btn btn-success btn-circle"><i class="fa fa-clone" title="RELOAD PROCESS"></i></button>功能:function copyIE(elem,indent){ var url = $(elem).attr("url"); formManager='#formManager'+indent; csrfValue=$("input[name=csrfmiddlewaretoken]").val() $(formManager).attr("action", url); /* get the hidden input's value, construct another input element, and append to the form */ $('<input>').attr({ type: 'hidden', id: 'id', name: 'id', value: indent }).appendTo(formManager); /* get the csrf token, construct another input element, and append to the form */ $('<input>').attr({ type: 'hidden', id: 'csrfmiddlewaretoken', name: 'csrfmiddlewaretoken', value: csrfValue }).appendTo(formManager); $(formManager).submit();}(线形命名为formManager{{proc.id}}以区分每一行)I am using DataTable in a web application and I find that DataTable is not compatible with inline forms with a <button type="submit" formaction="..."></button>. In IE 11 it is not working; submit does not work, but in Chrome 65 and Firefox 59 it is working.Table is a DataTable:$('#dataTable-script').DataTable({ "scrollX": true, /* horizontal scroll */ "responsive": false, /* turn this OFF to enable scrollX. Conflict. */ "columnDefs": [ { "visible": true, "targets": [0, 1, 2, 3, 4] }, /* always show 5 columns */ { "orderable": false, "targets": [9] } /* the last column not sortable */ ], "order": [ [ 6, 'desc' ] /* initial ordering */ ], "searching": true, /* enable searching/filtering; nothing to do with show/hide search input */ /* dom elements manipulation */ /* f: filter(search input); l: combobox of each page size, _T_ble, _I_nformation, _P_agination, p_R_ocessing-element. */ "dom": "<'row'<'col-md-7 col-lg-9 col-sm-4'l><'col-md-4 col-lg-3 col-sm-5'f>>" + /* 'l' and 'f' on the same line */ "<'row'<'col-md-12't>>" + /* table with correct margin */ "<'row'<'col-md-7 col-lg-9 col-sm-4'i><'col-md-4 col-lg-3 col-sm-5 pull-right'p>>" + /* 'i' and 'p' on the same line */ "r", "processing": true, /* indicate "processing..." when doing time-consuming task. Related to 'dom':'r': without 'r' it is hidden. */)};With every line as a form:<tbody> {% for script in scripts %} <tr class="odd gradeX"> <form enctype="multipart/form-data" method="post" id="formManager{{script.id}}"> {% csrf_token %} <input type='hidden' name='scriptID' value='{{script.id}}' /> <td>{{script.name}}</td> <td>{{script.category.name}}</td> <td>{{script.platform.name}}</td> ...And at the end of every line, a button like;<button type="submit" formaction="{% url 'deleteScript' %}" onclick="return confirm()" class="btn btn-danger btn-circle" title="Delete script"> <i class="fa fa-times"></i></button>I have created a demo in jsfiddle, however it shows that with DataTable it does not work even in Chrome neither Firefox, but it is not true; in reality it just stops in IE, only tested IE 11. However, if you delete the DataTable definition, it just works in IE and other modern web explorers, which is the same with my real code.I have searched and find ppl talking about DataTables ordering, even disabled, will delete some attributes and stop IE from working, but Chrome and FireFox can work without it. 解决方案 A colleague of mine found a solution: change the formaction into href and append param after the url, something like what this question states, but with details:Buttons change type to button and attached with a onclick function:<button type="button" url="{% url 'copyProcess' %}" onClick="copyIE(this,{{proc.id}})" class="btn btn-success btn-circle"><i class="fa fa-clone" title="RELOAD PROCESS"></i></button>The function:function copyIE(elem,indent){ var url = $(elem).attr("url"); formManager='#formManager'+indent; csrfValue=$("input[name=csrfmiddlewaretoken]").val() $(formManager).attr("action", url); /* get the hidden input's value, construct another input element, and append to the form */ $('<input>').attr({ type: 'hidden', id: 'id', name: 'id', value: indent }).appendTo(formManager); /* get the csrf token, construct another input element, and append to the form */ $('<input>').attr({ type: 'hidden', id: 'csrfmiddlewaretoken', name: 'csrfmiddlewaretoken', value: csrfValue }).appendTo(formManager); $(formManager).submit();}(the line form is named formManager{{proc.id}} to distinguish between each row) 这篇关于DataTable中的表单提交按钮在IE 11中不起作用(由于DataTable错误)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！