为复杂HTML导出数据表（python deform）

Question

我将DataTables jquery用于漂亮的表，而python的deform用于从模式轻松生成表单元素。DataTables导出功能不能很好地处理生成的表单元素。你知道吗

因此，我需要使用DataTables' export function来正确地生成导出。实际上，我可以在我的应用程序中想到四种类型的单元格（按复杂性增加的顺序排列），函数需要处理所有这些单元格。你知道吗

首先，一个标准<input>。这里的预期输出应该是with some brand

<input name="brand" value="with some brand" id="deformField1168" class=" form-control " type="text">

其次，textarea（这实际上是DataTables默认情况下唯一正确处理的区域，因为它strips away HTML to get 'only text contents'）。这里的预期输出是a short description

<textarea id="deformField1169" name="description" rows="2" class=" form-control ">a short description</textarea>

第三，一堆div，我用来在单元格的一侧放置一个trash/delete图标，否则这与第一种情况相同。如果这是唯一一个无法解决的问题，我不介意把图标移到它自己的单元格里，那样就更难看了。这里的预期输出是a_test_item

<div style="float: left; width: 85%; text-align: left">
    <input name="item_number" value="a_test_item" id="deformField1167" class=" form-control " type="text">
</div>
<div style="float: right; width: 15%; text-align: right">
    <form class="form" action="" method="post" accept-charset="utf-8" enctype="multipart/form-data">
        <input name="id" value="1" type="hidden">
        <button type="submit" class="btn btn-default" name="delete">
            <span class="glyphicon glyphicon-trash">
        </span></button>
    </form>
</div>

第四个也是最后一个，这组隐藏的输入+javascript将显示一个日期选择器。这里的预期输出是2017-03-07

<input name="__start__" value="delivery_date:mapping" type="hidden">
<input name="date" value="2017-03-07" id="deformField1171" class="  form-control hasDatepicker" type="date">
<input name="__end__" value="delivery_date:mapping" type="hidden">
<script type="text/javascript">
    deform.addCallback(
    'deformField1171',
     function deform_cb(oid) {
       if (!Modernizr.inputtypes['date'] ||"date" != "date" || window.forceDateTimePolyfill){
         $('#' + oid).pickadate({"format": "yyyy-mm-dd", "selectMonths": true, "selectYears": true, "formatSubmit": "yyyy-mm-dd"});
       }
     }
    );
</script>

我当前的exportOption函数如下所示本文件：你知道吗

exportOptions: {
    format: {
        body: function ( data, row, column, node ) {
            console.log(data)
            return data
        }
    }
}

我以前从未使用javascript处理过字符串（仅限于getElementByID等），而且似乎字符串处理并不是一种可行的方法。我能用这些单元格创建一个JS‘page’并使用标准HTML访问（所有getElement*函数）吗？你知道吗

Answer 1

像往常一样，把问题打出来能给我提供一些有帮助的见解。基于the accepted answer here about creating a DOM from a HTML string，以及所有可见输入都有类form-control的观察，下面是我编写的（令人尴尬的简单）函数。你知道吗

exportOptions: {
    format: {
        body: function ( data, row, column, node ) {
            var div = document.createElement('div')
            div.innerHTML = data
            var value = div.getElementsByClassName('form-control')[0].value
            return value
        }
    }
}