محمد المصري12 نشر 20 مايو 2021 أرسل تقرير مشاركة نشر 20 مايو 2021 سلام عليكم المودال بيظهر بالشكل التالي عندي الكود كالتالي <?php include("includes/db.php"); $title = "الموردين"; ?> <!doctype html> <html lang="ar"> <head> <style> .table-responsive{ overflow-x: visible !important; } tbody{ margin-bottom: 2rem; } .more{ margin-top: 2rem !important; } .dropdown-menu-main{ top: 40px !important; } </style> <?php include("includes/head.php"); ?> </head> <body> <?php include("includes/loader.php"); ?> <div class="app-container app-theme-white body-tabs-shadow fixed-sidebar fixed-header"> <?php include("includes/app-header.php"); ?> <?php include("includes/ui-theme-settings.php"); ?> <div class="app-main"> <?php include("includes/sidebar.php"); ?> <div class="app-main__outer"> <div class="app-main__inner"> <div class="app-page-title"> <div class="page-title-wrapper"> <div class="page-title-heading"> <div class="page-title-icon"> <i class="pe-7s-box2 icon-gradient bg-mean-fruit"> </i> </div> <div>الموردين <div class="page-title-subheading">إستعراض الموردين </div> </div> </div> <div class="page-title-actions"> <button type="button" data-toggle="tooltip" data-placement="bottom" class="btn-shadow mr-3 btn btn-dark"> <i class="fa fa-star"></i> </button> </div> </div> </div> <table class="table table-primary table-bordered" dir="rtl"> <thead> <tr class="table-primary" align="center"> <th scope="col">الكود</th> <th scope="col">اسم الشركة</th> <th scope="col">بنود التوريد</th> <th scope="col">إعدادات</th> </tr> </thead> <tbody> <?php //الاستعلام $result = $conn->query("SELECT * FROM supplier ORDER BY id DESC"); // تعريف المتغيرات while ($row = $result->fetch_assoc()) { //تعريف بنود التوريد $supplying_data = ' <select class="form-select form-select-lg mb-3" aria-label="بنود التوريد"> <option selected>افتح لمشاهدة بنود التوريد</option> '; if ($row['sFabric'] == "true") $supplying_data .= '<option>قماش</option> '; if ($row['sAcc'] == "true") $supplying_data .= '<option>اكسسوارات</option>'; if ($row['sCarton'] == "true") $supplying_data .= '<option>كرتون</option>'; if ($row['sLine'] == "true") $supplying_data .= '<option>خيوط</option>'; if ($row['sNeedle'] == "true") $supplying_data .= '<option>إبر حياكة</option>'; if ($row['sMac'] == "true") $supplying_data .= '<option>مكن</option>'; if ($row['sBag'] == "true") $supplying_data .= '<option>أكياس</option>'; $supplying_data .= '</select> '; //نهاية تعريف بنود التوريد //الجدول echo' <tr class="table-light" align="center"> <th scope="row">' . $row['id'] . '</th> <td >' . $row['facory'] . '</td> <td>' . $supplying_data . '</td> <td align="center"> <button type="button" class="btn btn-info" data-toggle="modal" data-target="#more">عرض المزيد</button> <button type="button" class="btn btn-primary">تعديل</button> <button type="button" class="btn btn-danger">حذف</button> </td> </tr>'; } ?> </tbody> </table> } <?php include("includes/footer.php"); ?> <!-- Starting More Modal --> <!-- Modal --> <!-- Modal --> <div class="modal fade" id="more" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog modal-lg" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">بيانات المورد</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <div class="table-responsive text-center"> <table class="align-middle mb-0 table table-borderless table-striped table-hover"> <thead> <tr> <th class="text-center">إسم الشركة/المورد</th> <th class="text-center">إسم صاحب الشركة</th> <th class="text-center">العنوان</th> <th class="text-center">بيانات الموردين</th> </tr> </thead> <tbody> <tr> <th class="text-center facory"></th> <th class="text-center oName"></th> <th class="text-center address"></th> <th class="text-center "> <div class="dropdown"> <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> بيانات التوريد </button> <div class="dropdown-menu supplying_data" aria-labelledby="dropdownMenu2"> </div> </div> </th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">رقم التليفون</th> <th colspan="2" class="text-center">رقم الواتساب</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center phone"></th> <th colspan="2" class="text-center whatsapp"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">البريد الإلكترونى</th> <th colspan="2" class="text-center">الويب سايت</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center email"></th> <th colspan="2" class="text-center website"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">صفحة الفيسبوك</th> <th colspan="2" class="text-center">تيليجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center facebook"></th> <th colspan="2" class="text-center telegram"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">تويتر</th> <th colspan="2" class="text-center">انستجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center twitter"></th> <th colspan="2" class="text-center instagram"></th> </tr> </tbody> <thead> <tr> <th colspan="4" class="text-center" style="color:blue;">بيانات التواصل غير المالك</th> </tr> </thead> <thead> <tr> <th colspan="2" class="text-center">رقم التليفون</th> <th colspan="2" class="text-center">رقم الواتساب</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center phone2"></th> <th colspan="2" class="text-center whatsapp2"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">البريد الإلكترونى</th> <th colspan="2" class="text-center">الويب سايت</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center email2"></th> <th colspan="2" class="text-center website2"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">صفحة الفيسبوك</th> <th colspan="2" class="text-center">تيليجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center facebook2"></th> <th colspan="2" class="text-center telegram2"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">تويتر</th> <th colspan="2" class="text-center">انستجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center twitter2"></th> <th colspan="2" class="text-center instagram2"></th> </tr> </tbody> <thead> <tr> <th colspan="4" class="text-center" style="color:blue;">كود QR</th> </tr> </thead> <thead> <tr> <th colspan="4" class="text-center"> <img id="qr" src="#"> </th> </tr> </thead> </table> </div> </div> <div class="modal-footer text-center"> <button type="button" class="btn btn-secondary" data-dismiss="modal">إغلاق</button> </div> </div> </div> </div> <!-- Endind More Modal --> <?php include("includes/js.php"); ?> </body> </html> ممكن اعرف ايه الخطأ اللي عندي اللي بيخلي الصفحة تتجمد اول ما افتح المودال و ما بعرفش اعمل اي حاجة تاني 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 Adnane Kadri نشر 20 مايو 2021 أرسل تقرير مشاركة نشر 20 مايو 2021 الظاهر أن خلفية المودل modal-backdrop تظهر فوق المودل modal نفسه . يحدث هذا السلوك عادة بسبب إمتلاك الحاوي لعنصر المودل الوضعية الثابتة fixed أو النسبية relative لذلك ينصح دوما بوضع المودل قبل وسم إغلاق الـ body مباشرة لتجنب هاته المشكلة أو التأكد من إمتلاك كل الحاويات لعنصر المودل الوضعية الإفتراضية . لكن في هاته الحالة ألحظ أنه يوجد بعض الوسوم المفتوحة التي لم يتم إغلاقها . في هاته الحالة تم إعتبارها كحاويات لما بعدها من عناصر مفتوحة أو مغلقة متضمنة المودل نفسه . لاحظ : <div class="app-container app-theme-white body-tabs-shadow fixed-sidebar fixed-header"> <div class="app-main"> <div class="app-main__outer"> <div class="app-main__inner"> <div class="app-page-title"> </div> # < < < من المفروض وجود وسم إغلاق # < < < من المفروض وجود وسم إغلاق # < < < من المفروض وجود وسم إغلاق # < < < من المفروض وجود وسم إغلاق <table class="table table-primary table-bordered" dir="rtl"> ... </table> لاحظ أيضا أن الحاوي الأول (عدم إغلاقه سيجعله حاويا لكل الوسوم المغلقة أو المفتوحة بعده) يملك الوضعية الثابتة بسبب الصفوف fixed-header و fixed-sidebar و هذا غالبا ما أدى إلى ظهور المشكلة . فحل المشكلة ببساطة هو في إغلاق الوسوم المفتوحة . إذ لم يكن هذا كفيلا بحل المشكلة يمكنك إعادة ترتيب العناصر على المحور Z عن طريق الخاصية z-index . فعندما تتداخل العناصر يمكن عن طريق تحديد قيمة هذه الخاصية تحديد ما هو العنصر الذي سيظهر أعلى بقية العناصر . يمكنك إعطاء العنصر بالصف modal-backdrop قيمة أقل : .modal-backdrop { z-index: -1; } 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 محمد المصري12 نشر 20 مايو 2021 الكاتب أرسل تقرير مشاركة نشر 20 مايو 2021 شكرا جزيلا لك اخي الفاضل فعلا اتحلت بعد اغلاق الوسوم المفتوحة ربنا يكرمك 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 محمد المصري12 نشر 21 مايو 2021 الكاتب أرسل تقرير مشاركة نشر 21 مايو 2021 بتاريخ 8 ساعات قال Adnane Kadri: الظاهر أن خلفية المودل modal-backdrop تظهر فوق المودل modal نفسه . يحدث هذا السلوك عادة بسبب إمتلاك الحاوي لعنصر المودل الوضعية الثابتة fixed أو النسبية relative لذلك ينصح دوما بوضع المودل قبل وسم إغلاق الـ body مباشرة لتجنب هاته المشكلة أو التأكد من إمتلاك كل الحاويات لعنصر المودل الوضعية الإفتراضية . لكن في هاته الحالة ألحظ أنه يوجد بعض الوسوم المفتوحة التي لم يتم إغلاقها . في هاته الحالة تم إعتبارها كحاويات لما بعدها من عناصر مفتوحة أو مغلقة متضمنة المودل نفسه . لاحظ : <div class="app-container app-theme-white body-tabs-shadow fixed-sidebar fixed-header"> <div class="app-main"> <div class="app-main__outer"> <div class="app-main__inner"> <div class="app-page-title"> </div> # < < < من المفروض وجود وسم إغلاق # < < < من المفروض وجود وسم إغلاق # < < < من المفروض وجود وسم إغلاق # < < < من المفروض وجود وسم إغلاق <table class="table table-primary table-bordered" dir="rtl"> ... </table> لاحظ أيضا أن الحاوي الأول (عدم إغلاقه سيجعله حاويا لكل الوسوم المغلقة أو المفتوحة بعده) يملك الوضعية الثابتة بسبب الصفوف fixed-header و fixed-sidebar و هذا غالبا ما أدى إلى ظهور المشكلة . فحل المشكلة ببساطة هو في إغلاق الوسوم المفتوحة . إذ لم يكن هذا كفيلا بحل المشكلة يمكنك إعادة ترتيب العناصر على المحور Z عن طريق الخاصية z-index . فعندما تتداخل العناصر يمكن عن طريق تحديد قيمة هذه الخاصية تحديد ما هو العنصر الذي سيظهر أعلى بقية العناصر . يمكنك إعطاء العنصر بالصف modal-backdrop قيمة أقل : .modal-backdrop { z-index: -1; } سلام عليكم اخي الفاضل الان انا ضفت مودال لتأكيد الحذف بالشكل الموضح بالكود و تأكدت من اغلاق جميع الوسوم لكنه ايضا حدثت معه نفس المشكلة الواردة بالموضوع ، هل اطمع في القاء نظرة فضلا <?php include("includes/db.php"); $title = "الموردين"; ?> <!doctype html> <html lang="ar"> <head> <style> .table-responsive{ overflow-x: visible !important; } tbody{ margin-bottom: 2rem; } .more{ margin-top: 2rem !important; } .dropdown-menu-main{ top: 40px !important; } </style> <?php include("includes/head.php"); ?> </head> <body> <?php include("includes/loader.php"); ?> <div class="app-container app-theme-white body-tabs-shadow fixed-sidebar fixed-header"> <?php include("includes/app-header.php"); ?> <?php include("includes/ui-theme-settings.php"); ?> <div class="app-main"> <?php include("includes/sidebar.php"); ?> <div class="app-main__outer"> <div class="app-main__inner"> <div class="app-page-title"> <div class="page-title-wrapper"> <div class="page-title-heading"> <div class="page-title-icon"> <i class="pe-7s-box2 icon-gradient bg-mean-fruit"> </i> </div> <div>الموردين <div class="page-title-subheading">إستعراض الموردين </div> </div> </div> <div class="page-title-actions"> <button type="button" data-toggle="tooltip" data-placement="bottom" class="btn-shadow mr-3 btn btn-dark"> <i class="fa fa-star"></i> </button> </div> </div> </div> <div class="table-responsive"> <table class="table table-primary table-bordered" dir="rtl"> <thead> <tr class="table-primary" align="center"> <th scope="col">الكود</th> <th scope="col">اسم الشركة</th> <th scope="col">بنود التوريد</th> <th scope="col">إعدادات</th> </tr> </thead> <tbody> <?php //الاستعلام $result = $conn->query("SELECT * FROM supplier ORDER BY id DESC"); //امر الحذف if (isset($_GET['del'])){ $terminated_user = $_GET['del']; $del = $conn->query("DELETE FROM `supplier` WHERE `supplier`.`id` = $terminated_user "); header('Location: s.php'); } // تعريف المتغيرات while ($row = $result->fetch_assoc()) { //تعريف بنود التوريد $id = $row['id']; $factory = $row['facory']; $supplying_data = ' <select class="form-select form-select-lg mb-3" aria-label="بنود التوريد"> <option selected>افتح لمشاهدة بنود التوريد</option> '; if ($row['sFabric'] == "true") $supplying_data .= '<option>قماش</option> '; if ($row['sAcc'] == "true") $supplying_data .= '<option>اكسسوارات</option>'; if ($row['sCarton'] == "true") $supplying_data .= '<option>كرتون</option>'; if ($row['sLine'] == "true") $supplying_data .= '<option>خيوط</option>'; if ($row['sNeedle'] == "true") $supplying_data .= '<option>إبر حياكة</option>'; if ($row['sMac'] == "true") $supplying_data .= '<option>مكن</option>'; if ($row['sBag'] == "true") $supplying_data .= '<option>أكياس</option>'; $supplying_data .= '</select> '; //نهاية تعريف بنود التوريد //الجدول echo' <tr class="table-light" align="center"> <th scope="row">' . $row['id'] . '</th> <td >' . $row['facory'] . '</td> <td>' . $supplying_data . '</td> <td align="center"> <button facory="'.$row['facory'].'" oName="'.$row['oName'].'" address="'.$row['address'].'" phone="'.$row['phone'].'" whatsapp="'.$row['whatsapp'].'" email="'.$row['email'].'" website="'.$row['website'].'" facebook="'.$row['facebook'].'" telegram="'.$row['telegram'].'" twitter="'.$row['twitter'].'" instagram="'.$row['instagram'].'" phone2="'.$row['phone2'].'" whatsapp2="'.$row['whatsapp2'].'" email2="'.$row['email2'].'" website2="'.$row['website2'].'" facebook2="'.$row['facebook2'].'" telegram2="'.$row['telegram2'].'" twitter2="'.$row['twitter2'].'" instagram2="'.$row['instagram2'].'" sFabric="'.$row['sFabric'].'" sAcc="'.$row['sAcc'].'" sCarton="'.$row['sCarton'].'" sLine="'.$row['sLine'].'" sNeedle="'.$row['sNeedle'].'" sMac="'.$row['sMac'].'" sBag="'.$row['sBag'].'" qr="'.$row['qr'].'" class="btn btn-outline-primary m-auto mt-2 more" data-toggle="modal" data-target="#more">عرض المزيد</button> <!-- زر التعديل --> <a href="edit_supplier.php?id=' . $row['id'] . '" target="_blank"></a> <button type="button" class="btn btn-primary">تعديل</button> <!-- زر الحذف --> <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#del">حذف</button> <!-- Delete modal --> <!-- Modal --> <div class="modal fade" id="del" role="dialog"> <div class="modal-dialog modal-sm"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">تأكيد الخذف</h4> </div> <div class="modal-body"> <p>هل تريد فعل حذف هذا المورد ، لن يمكنك التراجع</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">الغاء</button> </div> </div> </div> </div> </td> </tr>'; } ?> </tbody> </table> </div> </div> </div> </div> <?php include("includes/footer.php"); ?> </div> <!-- Starting More Modal --> <!-- Modal --> <!-- Modal --> <div class="modal fade" id="more" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog modal-lg" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">بيانات المورد</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <div class="table-responsive text-center"> <table class="align-middle mb-0 table table-borderless table-striped table-hover"> <thead> <tr> <th class="text-center">إسم الشركة/المورد</th> <th class="text-center">إسم صاحب الشركة</th> <th class="text-center">العنوان</th> <th class="text-center">بيانات الموردين</th> </tr> </thead> <tbody> <tr> <th class="text-center facory"> </th> <th class="text-center oName"></th> <th class="text-center address"></th> <th class="text-center supplying_data "> <div class="dropdown "> </div> </div> </th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">رقم التليفون</th> <th colspan="2" class="text-center">رقم الواتساب</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center phone"></th> <th colspan="2" class="text-center whatsapp"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">البريد الإلكترونى</th> <th colspan="2" class="text-center">الويب سايت</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center email"></th> <th colspan="2" class="text-center website"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">صفحة الفيسبوك</th> <th colspan="2" class="text-center">تيليجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center facebook"></th> <th colspan="2" class="text-center telegram"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">تويتر</th> <th colspan="2" class="text-center">انستجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center twitter"></th> <th colspan="2" class="text-center instagram"></th> </tr> </tbody> <thead> <tr> <th colspan="4" class="text-center" style="color:blue;">بيانات التواصل غير المالك</th> </tr> </thead> <thead> <tr> <th colspan="2" class="text-center">رقم التليفون</th> <th colspan="2" class="text-center">رقم الواتساب</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center phone2"></th> <th colspan="2" class="text-center whatsapp2"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">البريد الإلكترونى</th> <th colspan="2" class="text-center">الويب سايت</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center email2"></th> <th colspan="2" class="text-center website2"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">صفحة الفيسبوك</th> <th colspan="2" class="text-center">تيليجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center facebook2"></th> <th colspan="2" class="text-center telegram2"></th> </tr> </tbody> <thead> <tr> <th colspan="2" class="text-center">تويتر</th> <th colspan="2" class="text-center">انستجرام</th> </tr> </thead> <tbody> <tr> <th colspan="2" class="text-center twitter2"></th> <th colspan="2" class="text-center instagram2"></th> </tr> </tbody> <thead> <tr> <th colspan="4" class="text-center" style="color:blue;">كود QR</th> </tr> </thead> <thead> <tr> <th colspan="4" class="text-center"> <img id="qr" src="#"> </th> </tr> </thead> </table> </div> </div> <div class="modal-footer text-center"> <button type="button" class="btn btn-secondary" data-dismiss="modal">إغلاق</button> </div> </div> </div> </div> <!-- Endind More Modal --> <?php include("includes/js.php"); ?> <script> function added() {} $('.dropdown-toggle').dropdown(); $(".more").click( function() { var facory = $(this).attr("facory"), oName = $(this).attr("oName"), address = $(this).attr("address"), phone = $(this).attr("phone"), whatsapp = $(this).attr("whatsapp"), email = $(this).attr("email"), website = $(this).attr("website"), facebook = $(this).attr("facebook"), telegram = $(this).attr("telegram"), twitter = $(this).attr("twitter"), instagram = $(this).attr("instagram"), phone2 = $(this).attr("phone2"), whatsapp2 = $(this).attr("whatsapp2"), email2 = $(this).attr("email2"), website2 = $(this).attr("website2"), facebook2 = $(this).attr("facebook2"), telegram2 = $(this).attr("telegram2"), twitter2 = $(this).attr("twitter2"), instagram2 = $(this).attr("instagram2"), sFabric = $(this).attr("sFabric"), sAcc = $(this).attr("sAcc"), sCarton = $(this).attr("sCarton"), sLine = $(this).attr("sLine"), sNeedle = $(this).attr("sNeedle"), sMac = $(this).attr("sMac"), sBag = $(this).attr("sBag"), qr = $(this).attr("qr"); $(".facory").html(facory); $(".oName").html(oName); $(".address").html(address); $(".phone").html(phone); $(".whatsapp").html(whatsapp); $(".email").html(email); $(".website").html(website); $(".facebook").html(facebook); $(".telegram").html(telegram); $(".twitter").html(twitter); $(".instagram").html(instagram); $(".phone2").html(phone2); $(".whatsapp2").html(whatsapp2); $(".email2").html(email2); $(".website2").html(website2); $(".facebook2").html(facebook2); $(".telegram2").html(telegram2); $(".twitter2").html(twitter2); $(".instagram2").html(instagram2); // from here $(".supplying_data").empty(); var drop_down = `<select class="form-select" aria-label="بنود التوريد"><option selected>شاهد بنود التوريد</option>`; if (sFabric == "true") drop_down += `<option>قماش</option>`; if (sAcc == "true") drop_down += `<option>اكسسوارات</option>`; if (sCarton == "true") drop_down += `<option>كارتون</option>`; if (sLine == "true") drop_down += `<option>خيوط</option>`; if (sNeedle == "true") drop_down += `<option>إبر خياطة</option>`; if (sMac == "true") drop_down += `<option>ماكينات</option>`; if (sBag == "true") drop_down += `<option>اكياس</option>`; drop_down += `</select> ` $(".supplying_data").append(drop_down); // to here $("#qr").attr("src", qr); }); </script> </body> </html> 1 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 Adnane Kadri نشر 21 مايو 2021 أرسل تقرير مشاركة نشر 21 مايو 2021 بتاريخ 10 ساعات قال محمد المصري5: انا ضفت مودال لتأكيد الحذف بالشكل الموضح بالكود و تأكدت من اغلاق جميع الوسوم لكنه ايضا حدثت معه نفس المشكلة الواردة بالموضوع مرحبا أخي وعليكم السلام . أرجوا التدقيق جيدا فيما قلت سابقا . بتاريخ 19 ساعات قال Adnane Kadri: يحدث هذا السلوك عادة بسبب إمتلاك الحاوي لعنصر المودل الوضعية الثابتة fixed أو النسبية relative لذلك ينصح دوما بوضع المودل قبل وسم إغلاق الـ body مباشرة لتجنب هاته المشكلة أو التأكد من إمتلاك كل الحاويات لعنصر المودل الوضعية الإفتراضية . لكن في هاته الحالة ألحظ أنه يوجد بعض الوسوم المفتوحة التي لم يتم إغلاقها . في هاته الحالة تم إعتبارها كحاويات لما بعدها من عناصر مفتوحة أو مغلقة متضمنة المودل نفسه . فالمشكلة أساسا ليست في غلق الوسوم و إنما هي في إمتلاك الحاويات للمودل للوضعية الثابتة أو النسبية . أما بالنسبة لحالة عدم غلق الوسم هي في أنها سيتم إعتبار الوسم المفتوح حاويا لما بعده و بالتالي ستقوم وضعيته الثابتة أو النسبية بالتأثير على ظهور الموديل. صحيح أنك تقوم بغلق الوسوم بالفعل و لكن يحدث ذلك بعد إحتواءها لعنصر المودل نفسه و هذا ما يعطل ظهورها بشكل طبيعي و يجلعها تتخذ السلوك السابق . فالحل هو إما إخراجها من العناصر التي تمتلك وضعية ثابتة أو نسبية . أو إزالة الوضعية الثابتة أو النسبية في العناصر الحاوية . العنصر الحاوي المقصود : <div class="app-container app-theme-white body-tabs-shadow fixed-sidebar fixed-header"> اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 محمد المصري12 نشر 21 مايو 2021 الكاتب أرسل تقرير مشاركة نشر 21 مايو 2021 طيب بناء على كلام حضرتك ، انا شلت ال fixed position من ال container <div class="app-container app-theme-white body-tabs-shadow"> و لسه نفس القصة او يمكن انا مش فاهم قصدك لقلة خبرتي لو تفضلت توريني خطئي في الكود ممكن ده يساعدني افهم ، لانه التبس عليا الامر و لك جزيل الشكر اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
0 Adnane Kadri نشر 21 مايو 2021 أرسل تقرير مشاركة نشر 21 مايو 2021 بتاريخ 3 ساعات قال محمد المصري5: طيب بناء على كلام حضرتك ، انا شلت ال fixed position من ال container <div class="app-container app-theme-white body-tabs-shadow"> و لسه نفس القصة هل تستعمل أي ملفات تنسيقات خارجية ضمن وسم الـ head ؟ بتاريخ 3 ساعات قال محمد المصري5: لو تفضلت توريني خطئي في الكود ممكن ده يساعدني افهم ، لانه التبس عليا الامر قمت بمحاكاة الكود على جهازي ولم أواجه أي مشكلة . كما أنه يجب عليك تنظيف الكود و إعتماد كتابة أنظف أكثر حتى تتجنب أي التباس , قد يساعد هذا قراءة الكود و إتضاح المشاكل , كما أنه سيصبح من السهل التطوير و الإضافة عليه و في حالة الأخطاء سيتم تضييق الإحتماليات على عدد أقل بكثير . أمثلة : تقسيم بنية الملفات إلى css و js و تضمينها بالملف الرئيسي . تقسيم المكونات الكبيرة إلى مكونات أصغر يسهل تضمينها و التعامل معها و تطويرها . (من مثل : صف المورد في الجدول ) . اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
السؤال
محمد المصري12
سلام عليكم
المودال بيظهر بالشكل التالي عندي
الكود كالتالي
ممكن اعرف ايه الخطأ اللي عندي اللي بيخلي الصفحة تتجمد اول ما افتح المودال و ما بعرفش اعمل اي حاجة تاني
رابط هذا التعليق
شارك على الشبكات الإجتماعية
6 أجوبة على هذا السؤال
Recommended Posts
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.