How to apply sweetalert2 to allow second thought in "a href"

I have this code that allows user to update some fields in the table

public function review_recall(Request $request, $id)
{               
    $approved_count = Result::where('employee_id', $id)->count();
    if ($approved_count > 0){
  DB::beginTransaction(); 
    try {   
    $approved_post = Result::where('employee_id', $id)
            ->update([
                
                'published' => 1,
                'date' => date("Y-m-d H:i:s"),
                'approved' => 1,
                ]);


        DB::commit();
        Session::flash('success', 'Recalled successfully');
        return redirect()->back();
     } catch (Exception $exception) {

    DB::rollback();
            Session::flash('error', 'Action failed! Please try again');
            return redirect()->back();
    }             
    }else{
        Session::flash('info', 'You cannot proceed. Kindly check all goals appropriately!');
        return redirect()->back();
    }        
    
}

route:

Route::get('year_setups/review_recall/{id?}', 'SetupsController@review_recall')->name('setups.review_recall');

view:

    <div class="col-lg-4">

                <a href ="{{ route('year_setups.review_recall', ['id' => $goalmanager->employee_id])}}" class="btn btn-info"><i class="fas fa-minus-circle"></i> Recall</a>
     </div>

This works perfectly in using "a href" get method to update those three (3) fields in the table. However, I want to give the user a choice so that a dialog box comes up to ask him if he really wants to perform the action (Yes/No)

How do I use sweetalert2 or any other means to achieve this?

Thank you

MarianoMoreyra

5 years ago

Level 25

You can add an onclick call at your view:

<a href ="{{ route('year_setups.review_recall', ['id' => $goalmanager->employee_id])}}" class="btn btn-info" onclick="confirmation(event)">
	<i class="fas fa-minus-circle"></i> Recall
</a>

Then at the confirmation function you can do something like:

function confirmation(e) {
    e.preventDefault();

    var url = e.currentTarget.getAttribute('href')
    
    Swal.fire({
        icon: 'warning',
        title: 'Are you sure?',
        text: 'This action cannot be undone!',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes, recall!'
    }).then((result) => {
        if (result.value) {
            window.location.href=url;
        }
    })
}

Hope this helps!

noblemfd

5 years ago

Level 9

Hello @marianomoreyra - This what I have:

<a href ="{{ route('year_setups.review_recall', ['id' => $goalmanager->employee_id])}}" onclick="confirmation()" class="btn btn-info"><i class="fas fa-minus-circle"></i> Recall</a>

<script type="text/javascript">    
    function confirmation() {

      var y = document.getElementById("midyearRecall");
  
      y.style.display = "none";

   } 
</script>

And I want to implement this:

Swal({
  title: 'Are you sure?',
  text: 'You will not be able to recover this imaginary file!',
  type: 'warning',
  showCancelButton: true,
  confirmButtonText: 'Yes, delete it!',
  cancelButtonText: 'No, keep it'
}).then((result) => {
  if (result.value) {
    Swal(
      'Deleted!',
      'Your imaginary file has been deleted.',
      'success'
    )
  // For more information about handling dismissals please visit
  // https://sweetalert2.github.io/#handling-dismissals
  } else if (result.dismiss === Swal.DismissReason.cancel) {
    Swal(
      'Cancelled',
      'Your imaginary file is safe :)',
      'error'
    )
    }
    })

Snapey

5 years ago

Level 122

You should never update something with a get request. search engines could follow the link or a browser could prefetch the content causing the action to be prematurely performed.

You should be able to call a get route as many times as you like, with no side effects.

So, send your data in a form. The rest is just standard sweetalert functionality for form submission confirmation.

MarianoMoreyra

5 years ago

Best Answer

Level 25

Hey @noblemfd , Snapey made a great point there! You should pay close attention to his advice!

Regarding the sweetalert, as Snapee said, it's standard sweetalert functionality.

Check that I have an eventparameter to the confirmation function. You'll need that in order to prevent the link follow until you have your confirmation.

Add that and basically copy and paste your Swal code after de e.preventDefault() and after the url = e.currentTarget.getAttribute('href'); (I've missed the ; on my previous answer) and I think it should work.

Please or to participate in this conversation.