پیش به سوی تابستان؛ با تخفیفهای داغ راکت!
بزن بریم!سلام کسی با ادیتور 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.
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟