Home > Mobile >  How to get the id of form inside for loop in laravel?
How to get the id of form inside for loop in laravel?

Time:10-24

In my web.php

Route::get('/show', 'StudentsController@show');
Route::POST('/student_delete/{id}', 'StudentsController@delete');

In my controller StudentsController.php :

public function show()
    {
    $students = DB::table('students')
            ->select('*')
            ->get();
        return view('students',['students'=>$students]);
    }
public function delete($id)
    {
        DB::table('students')->where('id', '=', $id)->delete();
        return back();
    }

In my view students.blade.php :

<table>
    <tr>
        <th> name</th>
        <th> tel</th>
        <th> # </th>
    </tr>
    @for($m=0; $m< 10;$m  )
        <tr>
            <td><input type="text" value="{{$students[$m]->name}}"/></td>
            <td><input type="text" value="{{$students[$m]->tel}}"/></td>

            <form action="/student_delete/{{$students[$m]->id}}" id="{{$students[$m]->id}}"method="POST">
                {{ csrf_field() }}
                <td><button type="submit" class="btn btn-danger remove-tr">-</button></td>
            </form>
        </tr>
    @endfor
</table>    

The problem is here in my script to fire sweet alert after deleting a student,How do I get the id of form of student that I want to delete? this is my script :

<script>
        
    $("#How_to_get_the_id_of_form_here").submit(function(e) {
    e.preventDefault();
    var form = this;
    Swal.fire({
    title: 'do you want to continue?',
    icon: 'question',
    iconHtml: '؟',
    confirmButtonText: 'yes',
    cancelButtonText: 'no',
    showCancelButton: true,
    showCloseButton: true
    }).then((result) => {
            if (result.isConfirmed) {
                form.submit();
            } else if(!result.isDenied) {
                console.log(result.isDenied);
            }
        });
    });
        
</script>   

CodePudding user response:

I would solve this problem in this way: Wrap script into function (id - would be as function parametr)

function deleteStudent (id) {
  e.preventDefault();
  var form = $("#"   id);
  Swal.fire({
    title: 'do you want to continue?',
    icon: 'question',
    iconHtml: '؟',
    confirmButtonText: 'yes',
    cancelButtonText: 'no',
    showCancelButton: true,
    showCloseButton: true
  }).then((result) => {
        if (result.isConfirmed) {
            form.submit();
        } else if(!result.isDenied) {
            console.log(result.isDenied);
        }
      });
}; 

Then set this function as onclick="deleteStudent ({{$students[$m]->id}});"

Here:

<form action="/student_delete/{{$students[$m]->id}}" id="{{$students[$m]->id}}"method="POST">
  {{ csrf_field() }}
  <td><button type="submit" class="btn btn-danger remove-tr" onclick="deleteStudent({{$students[$m]->id}});return false;">-</button></td>
</form>

Or - if confirmation dont work - the only way - place script in the loop:

<table>
  <tr>
      <th> name</th>
      <th> tel</th>
      <th> # </th>
  </tr>
  @for($m=0; $m< 10;$m  )
      <tr>
          <td><input type="text" value="{{$students[$m]->name}}"/></td>
          <td><input type="text" value="{{$students[$m]->tel}}"/></td>

          <form action="/student_delete/{{$students[$m]->id}}" id="{{$students[$m]->id}}"method="POST">
              {{ csrf_field() }}
              <td>
              <button type="submit" class="btn btn-danger remove-tr">-</button>
             </td>
           </form>

              <script>                    
                $("#{{$students[$m]->id}}").submit(function(e) {
                e.preventDefault();
                var form = this;
                Swal.fire({
                title: 'do you want to continue?',
                icon: 'question',
                iconHtml: '؟',
                confirmButtonText: 'yes',
                cancelButtonText: 'no',
                showCancelButton: true,
                showCloseButton: true
                }).then((result) => {
                        if (result.isConfirmed) {
                            form.submit();
                        } else if(!result.isDenied) {
                            console.log(result.isDenied);
                        }
                    });
                });                    
              </script> 
              
      </tr>
  @endfor
</table>

CodePudding user response:

Why use the id specifically when you can use a class shared by all the forms ?

@for($m=0; $m< 10;$m  )
    ...
    <form class="student-form-delete" action="/student_delete/{{$students[$m]->id}}" id="{{$students[$m]->id}}"method="POST">
        ...
    </form>
    ...
@endfor

and use that class name in your javascript

<script>        
$(".student-form-delete").submit(function(e) {
    e.preventDefault();
    var form = this;
    Swal.fire({
        ...
    });
        
</script>   
  • Related