(Angularjs) Upload ảnh
Chào cả nhà. Hiện tại mình đang làm phần upload ảnh. Mình muốn khi click vào 1 button thì nó link trực tiếp đường dẫn ảnh đã được cấu hình cho ck-finder để vào thư viện ảnh trên server. Nhưng mình chưa biết cấu hình sao. Mong cả nhà giúp đỡ. Thanks all!
1 CÂU TRẢ LỜI
Theo như mình đọc document và test từ trang https://docs.ckeditor.com/ckfinder/ckfinder3/#!/guide/dev_installation hay https://docs.ckeditor.com/ckfinder/demo/ckfinder3/samples/modals.html , thì có vẻ bạn có thể làm như thế này để chạy CKFinder từ button.
var button1 = document.getElementById( 'ckfinder-popup-1' );
var button2 = document.getElementById( 'ckfinder-popup-2' );
button1.onclick = function() {
selectFileWithCKFinder( 'ckfinder-input-1' );
};
button2.onclick = function() {
selectFileWithCKFinder( 'ckfinder-input-2' );
};
function selectFileWithCKFinder( elementId ) {
CKFinder.modal( {
chooseFiles: true,
width: 800,
height: 600,
onInit: function( finder ) {
finder.on( 'files:choose', function( evt ) {
var file = evt.data.files.first();
var output = document.getElementById( elementId );
output.value = file.getUrl();
} );
finder.on( 'file:choose:resizedImage', function( evt ) {
var output = document.getElementById( elementId );
output.value = evt.data.resizedUrl;
} );
}
} );
}
Khi đó, click vào nút Browse Server
thì Popup Window của CKFinder sẽ mở ra, cho phép bạn chọn file, bạn thử xem có được không
Hay ở trang này cũng có hướng dẫn tương tự tại https://docs.ckeditor.com/ckfinder/ckfinder3/#!/guide/dev_integration
Đấy là code ở phía js
, ngoài ra, để chạy được CKFinder trong project của mình, bạn cần code ở phần backend nữa.
Cụ thể, nếu bạn dùng PHP thì cần phải enable CKFinder PHP Connector, bạn có thể download source code về và làm theo hướng dẫn ở đây:
https://docs.ckeditor.com/ckfinder/ckfinder3-php/quickstart.html
Cảm ơn bạn. Mình đã làm được rồi. Hihi
Câu hỏi của bạn mơ hồ và khó hiểu quá
Bạn có thể giải thích rõ link trực tiếp đường dẫn ảnh đã được cấu hình cho ck-finder là sao, vào thư viện ảnh trên server là như thế nào không
Bạn chia sẻ đoạn code hiện tại của mình, và nói rõ mình muốn thực hiện điều gì, lên thì tốt
@thangtd90 Bình thường hi quản trị nội dung sẽ tích hợp ckfinder vào trong ckeditor. Nhưng mình muốn tích hợp ckfinder vào button FileUpload, để khi click vào button FileUpload nó sẽ mở ra popup chọn tệp của ckfinder thôi.