Laravel Ajax jquery obtiene valores al hacer clic en filas tr

Laravel Ajax jquery obtiene valores al hacer clic en filas tr

Tengo una tabla html que contiene información del producto:

  1. identificación
  2. Título

Y cuando hago clic en una fila o varias filas, me gustaría recuperar los ids en la matriz y modificar su título a través del controlador.

Ejemplo:

Hago clic en la primera fila y obtengo la primera identificación y cuando hago clic en la segunda fila obtengo la segunda identificación pero la primera desaparece.

Intento con esto:

Ajax

 var last_clicked;

$(document).on('click', "#Mytable tr:not(:first)", function () {


       $('#id_product').val(last_clicked.find('[class="fill_id_product"]').html());

 });

$('#update_product').click(function() { 
    var id = $('#id_product').val();
    var array_id = array.push(id);
    alert(array_id) ;

    $.ajax({
        type: 'POST',
        url: "{{action('ProdcutController@updateProduct')}}",
        data: {
            id: array_id,
        },

    success: function(data){
        alert("success");
    }                               
    });                             

 });

HTML:

 <a  id="update_product">Update Prodcut</a>

//Table
<table id="Mytable" class="table table-striped table-bordered table-checkable order-column">
    <thead>
        <tr>
            <th>Id </th>
            <th>Title</th>
        </tr>
    </thead>
    <tbody>
        @foreach($all_products as $all_product)
            <tr>
                <td>
                    <p class="fill_id_product">{{$all_product->id}}</p> 
                </td>
                <td>
                    <p hidden class="fill_title">{{$all_product->title}}</p> 
                </td>  
            </tr>
        @endforeach
            <input type="text" name="" id="id_product">
    </tbody>
</table>

Y mi controlador:

public function updateProduct(Request $request){
        $products = Product::where('id',$request->id)->get();
        foreach($products as $product){
        $product->title = "Title global";
        $product->save();
        }
        return ['products' => $products];
}   
Mostrar la mejor respuesta

compartir html renderizado y java-script que se puede ver como modo en vivo?

Lo que debe hacer es insertar la identificación en la matriz en la función de clic de fila.

Aquí está el código

<!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Untitled Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>

    <body>
    <a  id="update_product">Update Prodcut</a>
    <table id="Mytable" class="table table-striped table-bordered table-checkable order-column">
        <thead>
            <tr>
                <th>Id </th>
                <th>Title</th>
            </tr>
        </thead>
        <tbody>

                <tr>
                    <td>
                        <p class="fill_id_product">1</p> 
                    </td>
                    <td>
                        <p hidden class="fill_title">Title 1</p> 
                    </td>  
                </tr>

                 <tr>
                    <td>
                        <p class="fill_id_product">2</p> 
                    </td>
                    <td>
                        <p hidden class="fill_title">Title 2</p> 
                    </td>  
                </tr>
                 <tr>
                    <td>
                        <p class="fill_id_product">3</p> 
                    </td>
                    <td>
                        <p hidden class="fill_title">Title 3</p> 
                    </td>  
                </tr>


        </tbody>
    </table>


    <script>
    var clicked_ids = [];
    $(document).on('click', "#Mytable tr:not(:first)", function () {
    var product_id = $(this).find('[class="fill_id_product"]').html();
    alert(product_id);
    if(clicked_ids.indexOf(product_id) == -1){  
    clicked_ids.push(product_id);
    }

     console.log(clicked_ids);
     });


    $('#update_product').click(function() { 
        console.log(clicked_ids);
        $.ajax({
            type: 'POST',
            url: "{{action('ProdcutController@updateProduct')}}",
            data: {
                id: clicked_ids,
            },

        success: function(data){
            alert("success");
        }                               
        });                             

     });
    </script>


    </body>
    </html>

También debe cambiar el inicio de sesión del controlador porque ahora está enviando los ID en una matriz sin un solo ID, por lo que debe cambiar la condición a where id IN($request->id)

Hola Wassem Gracias. cuando hago clic en la primera fila y la segunda, la matriz contiene el ejemplo (1,2) Funciona muy bien. Pero cuando hago clic una vez más en la primera fila, me gustaría eliminar el 1 de la matriz.

Use el bloque else para esto si la identificación ya está en la matriz, luego elimine esto. else{ var index = clicked_ids.indexOf(product_id); clicked_ids.splice(índice, 1); }