سلام کسی با ادیتور tinymce عکس آپلود کرده؟
من هر کدی از نت برمیدارم جوریه که توی خود فیلد تکست ادرس عکس رو میزاره و جایی توی پروژه آپلودش نمیکنه! یا حداقل من پیداش نمیکنم
و همین باعث میشه موقع پرینت اطلاعات اون عکسایی که توی فیلد تکست هستن رو نمایش نمییده تو صفحه پرینت
کسی تجربه کار با این ادیتور رو داره راهنمایی کنه؟
@miladparsi1070
سلام من با این ادیتور کار نکردم ولی بنظر خوب میاد ، فکر میکنم از froala editor و summernote editor باشه.
خلاصه داخل لینک زیر خیلی خوب توضیح داده که چطور میشه عکس آپلود کرد:
upload-images
خیلی ساده وقتی عکس select میشه ، یک کالبک صدا زده میشه و داخل اون میتونی راحت درخواست ajax بزنی به سرورت و عکس رو آپلود کنی و url عکس رو با نام location ، از سرور برگردونی .
البته روش ساده تری هم داره ، مثل اینکه به متد آپلود و کالبک خود ادیتور تکیه کنید.
البته برای روش اول این مثال رو زده.
tinymce.init({
selector: 'textarea', // change this value according to your HTML
images_upload_handler: function (blobInfo, success, failure) {
var xhr, formData;
xhr = new XMLHttpRequest();
xhr.withCredentials = false;
xhr.open('POST', 'postAcceptor.php');
xhr.onload = function() {
var json;
if (xhr.status != 200) {
failure('HTTP Error: ' + xhr.status);
return;
}
json = JSON.parse(xhr.responseText);
if (!json || typeof json.location != 'string') {
failure('Invalid JSON: ' + xhr.responseText);
return;
}
success(json.location);
};
formData = new FormData();
formData.append('file', blobInfo.blob(), fileName(blobInfo));
xhr.send(formData);
}
});
و خروجی سرور باید به این صورت باشه :
{ location : '/uploaded/image/path/image.png' }
اینی که نوشتینو تست کردم ولی اصلا دکمه ای توی ادیتور برای آپلود عکس نمیاره
من خودم اینو استفاده کردم:
tinymce.init({
selector: '#about',
images_upload_handler: function (blobInfo, success, failure) {
var xhr, formData;
xhr = new XMLHttpRequest();
xhr.withCredentials = false;
xhr.open('POST', 'ckeditor/upload');
var token = '{{ csrf_token() }}';
xhr.setRequestHeader("X-CSRF-Token", token);
xhr.onload = function () {
var json;
if (xhr.status != 200) {
failure('HTTP Error: ' + xhr.status);
return;
}
json = JSON.parse(xhr.responseText);
if (!json || typeof json.location != 'string') {
failure('Invalid JSON: ' + xhr.responseText);
return;
}
success(json.location);
};
formData = new FormData();
formData.append('file', blobInfo.blob(), blobInfo.filename());
xhr.send(formData);
}
});
این آپلود میکنه ولی عکس رو هم توی فیلد description ذخیره میکنه و بعد موقع پرینت گرفتن از اطلاعات عکسو نشون نمیده
خب برای فعال شدن image باید پلاگینش رو فعال کنی :
Insert an image into TinyMCE.
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟