how to select a form inside a datatables without an id

Question

Ive this form write inside a table with html laravel collective:

 @foreach($patients as $patient)
            <tr>
                {{Form::open(['route' => 'patientDetails'])}}
                {{Form::hidden('patient',json_encode($patient))}}
                {{Form::close()}}
                <td>{{$patient['display']}}</td>
                .......
                </td>
                </a>
            </tr>           
        @endforeach

        </tbody>
        <tfoot>

Then i wrote this script part, thats would lets the user to a new page when he hits a row of the table, with the data presente on hidden form.

$(document).ready(function(e) {
    $('#patients').DataTable({
        responsive: true,
        fixedColumns:   true,
        columnDefs: [
            {
                targets: "_all",
                className: 'dt-body-center'
            }
        ]
    });
    var table = $('#patients').DataTable();
    $('#patients tbody').on('click', 'tr', function () {
        var data = table.row( this ).data();
        if (window.confirm( 'Stai per accedere ai dettagli di: '+data[0]+'' )) {
         //here I need a way to select the form inside the row just cliked
            console.log(data); //this do not contains the hidden form
        };});});

maybe ive mixed too many concept and there is an easy way to accieve the same goal ( click on a row of this table and go to a next page with some additional data via post method) but actually id like to find a way to select the form inside the row via jquery and then doing a submit.

Answer 1

So, in this example there are two rows, each with a form in their first TD. All you have to do is attach the handler to each TR and use jQuery's selectors to find the form inside that TR. Finally you just invoke submit on it.

I hope the idea helps you.

$(document).ready(function(e) {
    const table = $('#patients').DataTable({
        responsive: true,
        fixedColumns:   true,
        columnDefs: [
            {
                targets: "_all",
                className: 'dt-body-center'
            }
        ]
    });
    
    table.on('click', 'tr', function () {
        const form = $(this).find('form').first();
        if (window.confirm( 'Stai per accedere ai dettagli di: '+form.attr('action')+'' )){
         //here I need a way to select the form inside the row just cliked
          //  console.log(data); //this do not contains the hidden form
        
          form.submit()
        };
    });
        
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<link href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css" rel="stylesheet"/>

<table id="patients" class="display" style="width:100%">
        <thead>
            <tr>
                <th>Form</th>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tbody>
        <tr>
                <td>
                <form method='get' action='https://google.com'>
                  
                  <input type='submit' value='GOOGLE'/>
                </form>
                </td>

                <td>Tiger Nixon</td>
                <td>System Architect</td>
                <td>Edinburgh</td>
                <td>61</td>
                <td>2011/04/25</td>
                <td>$320,800</td>
            </tr>
            <tr>
            <td>
                <form method='get' action='https://wikipedia.com'>
                  <input type='submit' value='WIKIPEDIA'/>
                </form>
                </td>
                <td>Garrett Winters</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>63</td>
                <td>2011/07/25</td>
                <td>$170,750</td>
            </tr>
          </tbody>
           </table>