ساختن یک modal برای گرفتن تاییدیه برای حذف یک مطلب

- 1 هفته پیش
توسط Alimotreb آپدیت شد
hamed sarkhosh ( 1970 تجربه )
2 هفته پیش

سلام دوستان.
من یه جدول از مقالات دارم داخل پنل مدیریتم که یک گزینه ی حذف برای هر مقاله داره. حالا برای اطمینان بیشتر که یه موقع اشتباهی دستم به روی دکمه نخوره و مقاله حذف بشه می خوام وقتی روی دکمه کلیک میشه قبل اینکه مقاله رو حذف کنه یه modal باز بشه که ازم سوال کنه آیا برای حذف اطمینان دارید. اگه تایید کردم به روت مورد نظر بره و عمل حذف انجام بشه. اگر تایید نکردم حذف نشه.
حالا خواستم ببینم همچین چیزی رو چجوری می تونم پیاده سازی کنم؟
دیدم که sweetalert یا vuetify همچین مواردی وجود داره. ولی نمی دونم چجوری باید به اون دکمه ها روت مورد نظرم رو بدم و بگم اگه روش کلیک انجام شد مثلا این کار انجام بشه یا نشه. کسی می تونه راهنمایی کنه ؟

بهترین پاسخ انتخاب شده توسط hamed sarkhosh
Alimotreb
2 هفته پیش

سلام
@ham.sarkhosh

با sweet alert بسیار ساده و راحت هست!
برای حذف اون دکمه حذف رو توی یه فرم قرار بدید

 <form action="{{ route('articke.destroy',$article->id) }}" method="post" id="pakidan">
                                                                                {{csrf_field()}}
                                                                                <input type="hidden" name="_method" value="DELETE">
                                                                                <button type="submit"
                                                                                        class="btn btn-sm btn-outline-success ajax_delete">حذف
                                                                                </button>
                                                                            </form>

اینم از قسمت جاوا اسکریپت مربوط به پلاگین sweet alert

<script>
    $(".ajax_delete").on("click", function validateForm(event) {
      event.preventDefault(); // prevent form submit
      var form = $('#pakidan'); // storing the form
      swal({
             title: "آیا از پاک کردن مقاله مطمئن هستید",
             text: "این مقاله اگر حذف شود دیگر قابل بازگردانی نیست!",
             icon: "warning",
             buttons: true,
             dangerMode: true,
           })
          .then((willDelete) => {
               if (willDelete) {

                     form.submit();
               } else {
                      swal("فایل شما پاک نشد!");
           }
        });
});
</script>

راحت و ساده تست بگیرید بسیار کاربردی هم هست!
.از نصب بودن پلاگین هم روی پروژه اطمینان حاصل کنید قبلش

Alimotreb ( 42272 تجربه )
2 هفته پیش

سلام
@ham.sarkhosh

با sweet alert بسیار ساده و راحت هست!
برای حذف اون دکمه حذف رو توی یه فرم قرار بدید

 <form action="{{ route('articke.destroy',$article->id) }}" method="post" id="pakidan">
                                                                                {{csrf_field()}}
                                                                                <input type="hidden" name="_method" value="DELETE">
                                                                                <button type="submit"
                                                                                        class="btn btn-sm btn-outline-success ajax_delete">حذف
                                                                                </button>
                                                                            </form>

اینم از قسمت جاوا اسکریپت مربوط به پلاگین sweet alert

<script>
    $(".ajax_delete").on("click", function validateForm(event) {
      event.preventDefault(); // prevent form submit
      var form = $('#pakidan'); // storing the form
      swal({
             title: "آیا از پاک کردن مقاله مطمئن هستید",
             text: "این مقاله اگر حذف شود دیگر قابل بازگردانی نیست!",
             icon: "warning",
             buttons: true,
             dangerMode: true,
           })
          .then((willDelete) => {
               if (willDelete) {

                     form.submit();
               } else {
                      swal("فایل شما پاک نشد!");
           }
        });
});
</script>

راحت و ساده تست بگیرید بسیار کاربردی هم هست!
.از نصب بودن پلاگین هم روی پروژه اطمینان حاصل کنید قبلش

hamed sarkhosh ( 1970 تجربه )
2 هفته پیش

@Alimotreb
خیلی عالی بود ممنونم از راهنماییتون.

Alimotreb ( 42272 تجربه )
1 هفته پیش

سلام
@ham.sarkhosh

خواهش میکنم دوست عزیز

برای ارسال پاسخ باید وارد سایت شوید