Hamada Ahmed نشر 22 أغسطس 2021 أرسل تقرير مشاركة نشر 22 أغسطس 2021 السلام عليكم في البرنامج التالي يتم ارسال رسالة لقاعدة البيانات ربما تحتوي معها صورة ويتم عرض الصورة قبل رفعها <img class="img-thumbnail" id="viewimg" style="display:none;"> بعد الارسال يتم تفريغ حقل النص $('#messages_form_groups')[0].reset(); المشكلة ان الصورة المعروضة تظل عالقة ولا تختفي الا بعد اعادة تحميل الصفحة كيف يمكن ازالة عرضالصورة بعد الارسال كما حدث للنص فى منطقة textarea <img class="img-thumbnail" id="viewimg" style="display:none;"> <form id="messages_form_groups" enctype="multipart/form-data" class="form_msgs"> <label for="file" title="صورة"> <img src="images/photo_upload.png" /> </label> <input name="picname" id="putname" type="hidden"> <textarea class="textarea_msgs_groups" name="message" id="message" maxlength="350" placeholder="اكتب رسالة ...."> </textarea> <div class="myButton" title="ارسال"> <INPUT type="submit" name="submit_profile" value=""> </div> <script> $("#messages_form_groups").on('submit', function(e) { e.preventDefault(); $.ajax ({ type: 'POST', url: 'send_pages/send_messages_form_groups.php', data: new FormData(this), dataType: 'json', contentType: false, cache: false, processData:false, success: function(response) { if(response.status == 1) { $('#messages_form_groups')[0].reset(); } } }); }); }); </script> 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
1 Adnane Kadri نشر 22 أغسطس 2021 أرسل تقرير مشاركة نشر 22 أغسطس 2021 بتاريخ منذ ساعة مضت قال Hamada Ahmed: بعد الارسال يتم ازالة الفورم كليا مع viewimg عذرا , قد ورد خطأ في الكود هنا بالضبط : $('#messages_form_groups').insertBefore(newEmptyImg); فالمفروض أن يقوم هذا بـ تضمين العنصر الجديد قبل العنصر بالمعرف messages_form_groups , و هو ما نحتاجه و صوابه : $(newEmptyImg).insertBefore('#messages_form_groups'); قم باستبدال الخطأ بصوابه و أخبرني بالنتيجة 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
1 Adnane Kadri نشر 22 أغسطس 2021 أرسل تقرير مشاركة نشر 22 أغسطس 2021 لا يؤدي تغيير خاصية src إلى "إلغاء تحميل" مورد الصورة - بل سيزيل فقط ارتباطها بعنصر <img /> هذا . أي أن التغييرات لن تظهر مباشرة , بل ستظهر في حالة إعادة تحميل عنصر الصورة مجددا . لأن إعادة التحميل ليس شيئًا يمكنك تحقيقه بالصور ، و في الغالب أنك لا تريد حقًا "تفريغه". بل تحاول إخفاءه أو إزالته أو ربما إعادة تحميله ، ولكن عليك الاحتفاظ به لأسباب معينة . و لذلك سيتبقى حل أن تقوم بحذف الصورة كليا ثم إعادة تضمين صورة جديدة بعد عرضها و إرسال طلب الأجاكس . و لذلك سيكون الكود الخاص بالعملية كاملة مشابها للتالي : <!-- لنتأكد من تعريف الصورة --> <img class="img-thumbnail" id="viewimg" style="display:none;"> <form id="messages_form_groups" enctype="multipart/form-data" class="form_msgs"> <label for="file" title="صورة"> <img src="images/photo_upload.png" /> </label> <input name="picname" id="putname" type="hidden"> <textarea class="textarea_msgs_groups" name="message" id="message" maxlength="350" placeholder="اكتب رسالة ...."> </textarea> <div class="myButton" title="ارسال"> <input type="submit" name="submit_profile" value=""> </div> <script> $("#messages_form_groups") .on('submit', function(e) { e.preventDefault(); $.ajax({ type: 'POST', url: 'send_pages/send_messages_form_groups.php', data: new FormData(this), dataType: 'json', contentType: false, cache: false, processData: false, success: function(response) { if (response.status == 1) { $('#messages_form_groups')[0].reset(); // إزالة العنصر كاملا $('#viewimg').remove(); // صورة جديدة فارغة var newEmptyImg = '<img class="img-thumbnail" id="viewimg" style="display:none;">'; // وضعها مكان السابقة $('#messages_form_groups').insertBefore(newEmptyImg); } } }); }); }); </script> 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 Hamada Ahmed نشر 22 أغسطس 2021 الكاتب أرسل تقرير مشاركة نشر 22 أغسطس 2021 بتاريخ منذ ساعة مضت قال Adnane Kadri: لا يؤدي تغيير خاصية src إلى "إلغاء تحميل" مورد الصورة - بل سيزيل فقط ارتباطها بعنصر <img /> هذا . أي أن التغييرات لن تظهر مباشرة , بل ستظهر في حالة إعادة تحميل عنصر الصورة مجددا . لأن إعادة التحميل ليس شيئًا يمكنك تحقيقه بالصور ، و في الغالب أنك لا تريد حقًا "تفريغه". بل تحاول إخفاءه أو إزالته أو ربما إعادة تحميله ، ولكن عليك الاحتفاظ به لأسباب معينة . و لذلك سيتبقى حل أن تقوم بحذف الصورة كليا ثم إعادة تضمين صورة جديدة بعد عرضها و إرسال طلب الأجاكس . و لذلك سيكون الكود الخاص بالعملية كاملة مشابها للتالي : <!-- لنتأكد من تعريف الصورة --> <img class="img-thumbnail" id="viewimg" style="display:none;"> <form id="messages_form_groups" enctype="multipart/form-data" class="form_msgs"> <label for="file" title="صورة"> <img src="images/photo_upload.png" /> </label> <input name="picname" id="putname" type="hidden"> <textarea class="textarea_msgs_groups" name="message" id="message" maxlength="350" placeholder="اكتب رسالة ...."> </textarea> <div class="myButton" title="ارسال"> <input type="submit" name="submit_profile" value=""> </div> <script> $("#messages_form_groups") .on('submit', function(e) { e.preventDefault(); $.ajax({ type: 'POST', url: 'send_pages/send_messages_form_groups.php', data: new FormData(this), dataType: 'json', contentType: false, cache: false, processData: false, success: function(response) { if (response.status == 1) { $('#messages_form_groups')[0].reset(); // إزالة العنصر كاملا $('#viewimg').remove(); // صورة جديدة فارغة var newEmptyImg = '<img class="img-thumbnail" id="viewimg" style="display:none;">'; // وضعها مكان السابقة $('#messages_form_groups').insertBefore(newEmptyImg); } } }); }); }); </script> بعد الارسال يتم ازالة الفورم كليا مع viewimg اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 Hamada Ahmed نشر 23 أغسطس 2021 الكاتب أرسل تقرير مشاركة نشر 23 أغسطس 2021 بتاريخ 9 ساعات قال Adnane Kadri: عذرا , قد ورد خطأ في الكود هنا بالضبط : $('#messages_form_groups').insertBefore(newEmptyImg); فالمفروض أن يقوم هذا بـ تضمين العنصر الجديد قبل العنصر بالمعرف messages_form_groups , و هو ما نحتاجه و صوابه : $(newEmptyImg).insertBefore('#messages_form_groups'); قم باستبدال الخطأ بصوابه و أخبرني بالنتيجة شكرا حبيبي الغالي يعمل بنجاح 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
السؤال
Hamada Ahmed
السلام عليكم
في البرنامج التالي يتم ارسال رسالة لقاعدة البيانات ربما تحتوي معها صورة ويتم عرض الصورة قبل رفعها
بعد الارسال يتم تفريغ حقل النص
$('#messages_form_groups')[0].reset();
المشكلة ان الصورة المعروضة تظل عالقة ولا تختفي الا بعد اعادة تحميل الصفحة
كيف يمكن ازالة عرضالصورة بعد الارسال كما حدث للنص فى منطقة textarea
رابط هذا التعليق
شارك على الشبكات الإجتماعية
4 أجوبة على هذا السؤال
Recommended Posts
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.