Question 313953 in Laravel Question posted in
The official Laravel Documentation can be found here.

JavaScript dialog delete error in Laravel 9

I want to create a confirmation dialog in JavaScript before deleting an item.

My JavaScript code

function confirmerSuppression() {
        var confirmation = confirm("Êtes-vous sûr de vouloir supprimer cet élément ?");

        if (confirmation) {
            window.location.href = '/tiers.destroy/' + id; // 
        } else {
            alert("Suppression annulée !");
        }
    }

Code for my delete button

<form action="{{route('tiers.destroy', $tiers->id)}}" method="POST">
@csrf  
<button onclick="confirmerSuppression()" class="btn btn-danger w-100 type="submit">DELETE</button>                                 
</form>

My route:

Route::post('/tiers/details/{id}', [AppHttpControllerstiersController::class, 'destroy'])->name('tiers.destroy');

My controller :

public function destroy($id)
    {
        Tier::where("id","=",$id)->delete();
        return redirect()->route('prospects.liste')->with("success","Tier supprimée avec succès.");
    }

When I click on the DELETE button the dialog appears and when I click on Cancel it deletes the element the same when I click on Yes.

Anyone have an idea please.

Tags:

2

Answers


  1. 0

    It looks like the issue might be related to how you’re constructing the URL for deletion in your JavaScript code. The id variable is not defined within the confirmerSuppression function.

    Here’s an updated version of your code:

    function confirmerSuppression(id) {
    var confirmation = confirm("Êtes-vous sûr de vouloir supprimer cet élément ?");

    if (confirmation) {
        window.location.href = '/tiers/details/' + id + '/destroy';
    } else {
        alert("Suppression annulée !");
    }
}

    And in your HTML:

    <form action="{{ route('tiers.destroy', $tiers->id) }}" method="POST">
    @csrf  
    <button type="button" onclick="confirmerSuppression({{ $tiers->id }})" class="btn btn-danger w-100">DELETE</button>                                 
</form>

    Make sure to pass the id from your PHP code to the JavaScript function. Additionally, I adjusted the button type to "button" to prevent the form from being submitted before the confirmation.

    Also, make sure your route definition in the routes file is using the correct URL structure:

    Route::post('/tiers/details/{id}/destroy', [AppHttpControllerstiersController::class, 'destroy'])->name('tiers.destroy');

    Now, the id should be properly passed to the confirmerSuppression function, and the URL should be constructed correctly for deletion.

    Login or Signup to reply.
  2. 0

    You can replace your code with this

    function confirmerSuppression(id) {
    var confirmation = confirm("Êtes-vous sûr de vouloir supprimer cet élément ?");

    if (confirmation) {
        window.location.href = '/tiers.destroy/' + id;
    } else {
        alert("Suppression annulée !");
        return false; // Add this line to prevent form submission
    }
}
    <form onsubmit="return confirmerSuppression({{ $row->id }})"  action="{{route('tiers.destroy', $row->id)}}" method="POST">
                                                    @csrf
                                                    <button class="btn btn-danger w-100" type="submit">Submit</button>
                                                </form>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search