2013-02-21 23 views
5

Tôi muốn hiển thị toàn bộ bộ sưu tập trong bảng và đặt trường "tên" trong mỗi hàng tại chỗ có thể chỉnh sửa với X-editableLàm cách nào để sử dụng X-có thể chỉnh sửa trên các trường động trong mẫu Meteor?

có thể chỉnh sửa được với mỗi tên trong bảng bằng cách thêm gần đây " tùy chọn "chọn:

$('#collectionTable').editable({ 
    selector: '.editable-click', 
}); 

// I also need to setup a 'save' callback to update the collection... 

$('a.editable-click').on('save', function(e, params) { 
    console.log('Saved value: ' + params.newValue); 
    // TBD: update the collection 
}); 

Nhưng tôi không thể chạy một trong hai mẫu này cho đến khi hoàn thành mẫu và có sẵn nút DOM, vì vậy tôi đặt nút này vào phần trả lại" được hiển thị "của Mẫu.

Vấn đề là mỗi khi bộ sưu tập thay đổi, kết xuất được gọi, và sau đó một chỉnh sửa mới được đính kèm vào mỗi nút DOM cũng như một cuộc gọi lại khác. Điều này có nghĩa là rò rỉ bộ nhớ và nhiều cuộc gọi lại bất cứ khi nào một "tên" được lưu.

Rõ ràng tôi đang làm điều này sai, nhưng tôi không chắc nơi đúng nơi là để có thể chỉnh sửa và bật ('lưu', hàm())?

Trả lời

2

Gọi có thể chỉnh sửa sau mỗi lần hiển thị có vẻ đáng tin cậy (mặc dù tôi tưởng tượng có thể gây rò rỉ bộ nhớ). Nhưng nếu bạn muốn liên kết với các sự kiện như 'tiết kiệm', bạn nên chắc chắn để unbind tất cả các sự kiện hiện tại, nếu không bạn sẽ tiếp tục ràng buộc mới lưu sự kiện trên mỗi rendering:

Template.editableTable.rendered = function() { 

    $('#myParentTable').editable({ 
     selector: '.editable-click' 
    }); 

    $('a.editable-click').unbind('save').on('save', function(e, params) { 
     // Make changes to your collection here. 
    }); 

    }; 

tôi đã thử nghiệm với chỉ gọi có thể chỉnh sửa trên dựng hình đầu tiên của mẫu. Điều đó chủ yếu làm việc miễn là bạn chắc chắn sẽ gọi lại nếu mẫu bị hủy (ví dụ: sử dụng các bộ định tuyến tạo và hủy các mẫu động). Nhưng có một số trường hợp cạnh mà nó không có vẻ làm việc, vì vậy tôi đã trở lại chỉ để gọi có thể chỉnh sửa sau mỗi lần render.

0

Bạn không thể nhớ liệu bạn đã đặt có thể chỉnh sửa và trình xử lý sự kiện đã và chưa thực hiện nếu bạn đã có?

if (editable) { 
// enable editable and add the save listener 
// ... 
editable = true; 
} 
+0

Sẽ phức tạp hơn một chút, vì có thể chỉnh sửa được trên mỗi nút DOM. Vì vậy, tôi sẽ phải lặp qua từng nút và kiểm tra trạng thái của nó trước khi chạy có thể chỉnh sửa và bật ('lưu'). Đó là một giải pháp; Tôi không chắc đó có phải là tốt nhất không. – jpeskin

0

Tôi muốn để lại nhận xét nếu có thể, nhưng tôi chỉ có 29rep ngay bây giờ. Một nỗi đau. Dù sao đi nữa.

Tôi đã chỉnh sửa x làm việc trong Meteor 0.7.2 nhưng kể từ khi nâng cấp lên 0.8.0, nó không còn hiển thị chính xác nữa. Tôi có xu hướng kết thúc với một loạt các thẻ rỗng. Điều này là bực bội vì dữ liệu ở đó, không phải vào thời điểm hàm trả về được kích hoạt.

Cách tốt nhất để sử dụng x-có thể chỉnh sửa ngay bây giờ chỉ hiển thị một lần và không đảm bảo dữ liệu có ở đó.

Tôi đang sử dụng Bộ định tuyến sắt và các mẫu của tôi không được nhúng trong khối {{#each}} mà có vẻ là giải pháp cơ bản cho mô hình được hiển thị mới.

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