복잡한 HTML을위한 DataTables 내보내기 (파이썬 변형)

멋진 테이블에 DataTables jquery를 사용하고 있으며 스키마에서 양식 요소를 쉽게 생성 할 수 있도록 python의 변형을 사용하고 있습니다. DataTables 내보내기 기능은 생성 된 양식 요소와 함께 재생되지 않습니다.복잡한 HTML을위한 DataTables 내보내기 (파이썬 변형)

그 때문에 내 내보내기를 올바르게 생성하려면 DataTables' export function을 사용해야합니다. 사실 내 응용 프로그램에서 생각할 수있는 4 가지 유형의 셀이 있습니다 (복잡성이 증가하는 순서로 정렬 됨).이 함수는 모든 것을 처리해야합니다.

먼저, 표준 <input>. 여기에 예상 출력은 (이것은 단지 하나의 DataTables가 strips away HTML to get 'only text contents'로, 기본적으로 올바르게 처리 실제로) 둘째 with some brand

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

, 텍스트 영역이 될 것입니다. 여기서 예상 출력 달리이 첫번째 경우와 동일 셋째 a short description

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

, I는 셀의 일 개 측면에 아이콘을 삭제/휴지통을 배치하는 데 사용 된 div 스택 것이다. 이것이 해결할 수없는 유일한 경우라면, 아이콘을 자신의 셀로 옮기는 것을 싫어합니다. 그렇게하면 더 못 생깁니다. 여기에 예상 출력은 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>

네 번째와 마지막으로하는 날짜 선택기를 불러옵니다 숨겨진 입력이 세트 + 자바 스크립트가 될 것입니다. 여기에 예상 출력 될 것 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 기능은 다음과 같습니다 : - 내가 전에 (단지에서 getElementById 등으로) 문자열을 처리하기 위해 자바 스크립트를 사용한 적이

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

, 그것은 아무튼 문자열 처리가 어쨌든 갈 길입니다. 이러한 셀을 사용하여 JS '페이지'를 만들고 표준 HTML 액세스 (모든 getElement * 기능)를 사용할 수 있습니까?

출처

2017-02-22 Ng Oon-Ee

그리고 언제나처럼 질문을 타이핑하는 행위는 나를 돕는 통찰력을 제공합니다. 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 
     } 
    } 
}

출처

2017-02-22 18:33:28

복잡한 HTML을위한 DataTables 내보내기 (파이썬 변형)

답변

관련 문제