2012-12-17 49 views
9

Tôi đang sử dụng ckeditor cho phép người dùng nội tuyến chỉnh sửa nội dung trên một trang một lần đăng nhậpLàm cách nào để lưu nội dung trình chỉnh sửa nội tuyến trên máy chủ? .

Tôi biết tôi có thể truy cập vào dữ liệu sử dụng:

var data = CKEDITOR.instances.editable.getData(); 

nhưng tôi không biết làm thế nào để gửi dữ liệu đến một tập lệnh để tôi có thể cập nhật cơ sở dữ liệu. Sẽ rất tuyệt nếu kịch bản chạy mỗi lần ai đó bỏ chọn một phần tử contenteditable ... nhưng tôi không biết điều đó có thể xảy ra hay không.

Mọi mẹo đều tuyệt vời! :)

Trang web của tôi được tạo bằng php/mysql.

Trả lời

20

Something như thế này:

CKEDITOR.disableAutoInline = true; 

CKEDITOR.inline('editable', { 
    on: { 
     blur: function(event) { 
      var data = event.editor.getData(); 
      // Do sth with your data... 
     } 
    } 
}); 

Lưu ý rằng điều này sẽ không làm việc với các tương tác khác như: người sử dụng gọi editor.setData() ngừơi tiêu dùng đóng trang web trong khi chỉnh sửa. Nội dung sẽ bị mất trong các trường hợp như vậy. Nếu tôi là bạn, tôi thà kiểm tra định kỳ đối với dữ liệu mới:

CKEDITOR.disableAutoInline = true; 

var editor = CKEDITOR.inline('editable', { 
    on: { 
     instanceReady: function() { 
      periodicData(); 
     } 
    } 
}); 

var periodicData = (function(){ 
    var data, oldData; 

    return function() { 
     if ((data = editor.getData()) !== oldData) { 
      oldData = data; 
      console.log(data); 
      // Do sth with your data... 
     } 

     setTimeout(periodicData, 1000); 
    }; 
})(); 
+1

Có thể gọi ckeditor trên một lớp cụ thể, thay vì một ID - vì tôi có nhiều hơn một khu vực trên một trang để chỉnh sửa. –

+0

Thêm 'contenteditable =" true "' vào các phần tử của bạn và đặt 'CKEDITOR.disableAutoInline = false'. – oleq

+0

sau đó làm thế nào để tôi nhận được ckeditor để bắn vào mờ không: 'CKEDITOR.inline ('tít', { \t \t \t \t \t trên: { \t \t \t \t \t \t mờ: function (event) { ' –

1

Dường như "mờ" sự kiện có thể giúp bạn: http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#event:blur

+0

ok, vậy làm sao bạn biết "biên tập viên" là gì khi bạn có nhiều contenteditable = true elements trên trang, nhưng bạn không biết khi nào một trong số chúng sẽ hoạt động (hoặc có thể bạn don ' t thậm chí biết những gì các yếu tố sẽ được khởi tạo bởi vì một số có thể được thêm động.) Sử dụng CKEDITOR.on dường như không hoạt động (các sự kiện không bao giờ được gọi) – Michael

+0

Những gì tôi đã làm, tôi tạo ra các biên tập viên, tùy thuộc vào dữ liệu, đôi khi một, đôi khi mười và như vậy. Trong trường hợp này, tôi đã có một "trình soạn thảo" dụ trong kịch bản của tôi. Nó không phải là "CKEDITOR.on" toàn cầu nhưng là ví dụ chính xác "editor.on". Vì vậy, tôi đã có thể xác định chính xác "mờ" sự kiện chính xác trên mỗi trường hợp. Thông thường, nó là một hàm đơn giản gửi một thông báo "lấy dữ liệu (editor.getData()) và gửi nó" đến ứng dụng phần nói chuyện với một máy chủ. –

3
CKEDITOR.inline('editable' ,{ 
     on:{ 
      blur: function(event){ 
       if (event.editor.checkDirty()) 
        console.log(event.editor.getData()); 
      } 
     } 
    }); 

Hãy thử điều này.

Các vấn đề liên quan