2011-02-27 3 views
5

데이터베이스의 모든 데이터를 표시하는 데 DataTable (jQuery) 플러그인을 사용하는 PHP 페이지가 있습니다.jQuery DataTable - 새 행 추가 작동하지만 편집 가능하지 않습니다 (jeditable)

여기에 사용자에게 새 행을 추가하는 옵션, 즉 사용자가 데이터를 입력 할 수있는 새 레코드를 제공하고 싶습니다. 나는의 예를 다음 :

http://www.datatables.net/examples/api/add_row.html

하고 새 행을 만들 수 있었다.

그러나 생성되는 "id"속성을 추가하는 방법에 대해서는 완전히 확신 할 수 없으며 편집 가능한 방법을 잘 모르겠습니다.

현재 다른 모든 필드는 jeditable을 사용하여 편집 할 수 있습니다.

  $(document).ready(function() { 
      /* Init DataTables */ 
      var oTable = $('#example').dataTable({ 
      "iDisplayLength": 5, 
      //"bRetrieve": true, 
      "aLengthMenu": [[5, 10, 15, -1], [5, 10, 15, "All"]] 
      } 
      ); 


      /* Apply the jEditable handlers to the table */ 
      $('td', oTable.fnGetNodes()).editable('expenseFieldsUpdater.php', { 
       "callback": function(sValue, y) { 
        var aPos = oTable.fnGetPosition(this); 
        oTable.fnUpdate(sValue, aPos[0], aPos[1]); 
       }, 
       "submitdata": function (value, settings) { 
        return { 
         "row_id": this.parentNode.getAttribute('id'), 
         "column": oTable.fnGetPosition(this)[2], 
         "form_id": document.getElementById('formID').value 
        }; 
       }, 
       "height": "14px" 
      }); 
     }); 

     var giCount = 1; 
     function fnClickAddRow() { 
      $('#example').dataTable().fnAddData([ 
       ".1", 
       giCount+".2", 
       giCount+".3", 
       giCount+".4", 
       giCount+".5" ]); 
        giCount++; 
     } 

을하지만, 나는 완전히 편집 가능한 만들기에 대해 어떻게 이동하는 방법에 대한 확실하지 않다 다음과 같이
코드입니다. 모든 포인터가 매우 유용 할 것입니다.

내가 datatables 사이트에서 다음 게시물을 찾았지만, 그것들을 만드는 방법에 대한 이동하는 방법을 이해할 수 없었다 작동 :
http://datatables.net/forums/comments.php?DiscussionID=181

답변

2

당신은 http://code.google.com/p/jquery-datatables-editable/에 당신을 도울 수있는 플러그인을 찾을 수 있습니다. 이 플러그인은 표준 JQuery DataTables 플러그인을 강화하고 추가, 삭제 및 편집 작업을 처리합니다. HTML 예제를 다운로드 할 수 있습니다.

1

일반적으로 행을 추가하거나 편집 한 후에 테이블 행을 장식하는 $ (document) .ready 이벤트를 다시 실행해야합니다. 그래서 당신은 아마 전화에 밖으로 리팩토링해야

$('td', oTable.fnGetNodes()).editable() 

별도의 방법으로 당신이 $ (문서)에서 호출 할 수있는 .ready 및 fnClickAddRow에서().