RECUPERAT DES RESULTATS D'UN RECHERCHE LARAVEL

LE VRAI PROBLEME EST DE RECUPERER LE NOM DU PRODUIT APRES LA RECHERCHE ET L'INSERER DANS LA FACTURE
MAIS VU JAI ESSAYE UNE FONCTION QUI AFFICHE LE RESULTAT EN JAVASCRIPT MAIS VU QUE CEST UNE VARIABLE ELLE NE RECUPERE QUE LE PREMIER RESULTAT

MAIS VU QUE CEST UNE VARIABLE ELLE NE RECUPERE QUE LE PREMIER RESULTAT

recuperer des produits pour les ramener dans la facture qui se trouvent au dessus de la recherche sans pour autant les ajouter dans une quelconque base de donnees

J'aimerais stocker tous ceci dans un tableau de sorte a ressembler a celui ci
$product_bill = array('id', 'name_product', 'new_quantity', 'prix_de_vente');

<script type="text/javascript">

                                    function cart_add() {
                                        var i = 0;
                                        var product_id_var = $( "#product_id" ).val();
                                        var product_title_var = $( "#product_title" ).val();
                                        var product_price_min_var = $( "#product_price_min" ).val();
        
                                        var product_bill = new Array;
                                        product_bill[0] = product_id_var;
                                        product_bill[1] = product_title_var;
                                        product_bill[2] = product_price_min_var;
        
                                        text = "<td>" + product_bill[0] + "</td>";
                                        text += "<td>" + product_bill[1] + "</td>";
                                        text += '<td>'+'<input type="number" value="'+product_bill[2]+'" name="prix_product_bill" placeholder="PRIX de vente du Produit" id="prix_product_bill">'+'</td>';
                                        text += '<td>'+'<input type="number" value="" min="1" name="quantity_product_bill" placeholder="Quantite commande" id="quantity_product_bill">'+'</td>';
                                        text += '<td>'+'</td>';
                                        text += '<td>'+'</td>';
                                        text += '<td id="total_price">'+'</td>';

                                        document.getElementById("shopping_cart").innerHTML = text;
                                        total_price = parseInt(product_bill[2]);
                                        document.getElementById("total_price").innerHTML = total_price;

                                    }
                                </script>

public function search_client(Request $request){

      
       if($request->ajax()){
    
         $output="";
         $products = add_product::where('referent','LIKE','%'.$request->search."%")
                                    ->Orwhere('title','LIKE','%'.$request->search."%")
                                    ->Orwhere('description','LIKE','%'.$request->search."%")
                                    ->Orwhere('product_type','LIKE','%'.$request->search."%")
                                    ->Orwhere('category','LIKE','%'.$request->search."%")
                                    ->get();
         
         if($products){
      
            foreach ($products as  $row) {

                $i = 0;
            
             $output.='<div class="col-lg-3 col-md-4 col-sm-12">'.
                             '<div class="card product_item">'.
                                '<div class="body">'.
                                    '<div class="cp_img">'.
                                        '<img class="img-fluid2 img-fluid" src="../uploads/stock_agence_A/'.$row->image.'">'.
                                        '<div class="hover">'.
                                 
                                            '<input type="hidden" id="product_id" value="'.$row->id.'"/>'.
                                            '<input type="hidden" id="product_title" value="'.$row->title.'"/>'.
                                            '<input type="hidden" id="product_price_min" value="'.$row->price_min.'"/>'.
                                            '<button class="btn btn-primary btn-sm waves-effect" name="add_to_cart_name" onclick="cart_add()" id="add_to_cart">'.
                                                '<i class="zmdi zmdi-plus"></i>'.
                                            '</button>'.
                                            '<a href="javascript:void(0);" class="btn btn-danger btn-sm waves-effect"><i class="zmdi zmdi-shopping-cart"></i></a>'.
                                        '</div>'.
                                    '</div>'.
                                    '<div class="product_details">'.
                                        '<h5>'.'<input readonly class="input_commande" type="text" data-id="'.$row->id.'" value="'.$row->title.'"/></h5>'.
                                        '<ul class="product_price list-unstyled">'.
                                            '<li class="old_price">'.$row->price_min.'  Fcfa</li>'.
                                        '</ul>'.
                                    '</div>'.
                                '</div>'.
                            '</div>'.
                        '</div>';
                $i++;
            }
            return $output;  
 
         }
        }

    }

<?php

namespace App\Http\Controllers\agence_A;

use App\Http\Controllers\Controller;
use Illuminate\Http\Request;

use App\client_agence_A;
use App\add_product;
use App\stock_agence_A;
use Gloudemans\Shoppingcart\Facades\Cart;
//use DB;

class factureController extends Controller
{
    //
    public function index(){

        return view('agence_A.facture');

    }

    public function commande(Request $request, $id_client){

        $client_agence_A = client_agence_A::findOrfail($id_client);
        return view('agence_A.commande')->with('client_agence_A',$client_agence_A);

    }
    public function search_client(Request $request){
      
       if($request->ajax()){
    
         $output="";
         $products = add_product::where('referent','LIKE','%'.$request->search."%")
                                    ->Orwhere('title','LIKE','%'.$request->search."%")
                                    ->Orwhere('description','LIKE','%'.$request->search."%")
                                    ->Orwhere('product_type','LIKE','%'.$request->search."%")
                                    ->Orwhere('category','LIKE','%'.$request->search."%")
                                    ->get();
         
         if($products){
      
            foreach ($products as  $row) {

                $i = 0;
            
             $output.='<div class="col-lg-3 col-md-4 col-sm-12">'.
                             '<div class="card product_item">'.
                                '<div class="body">'.
                                    '<div class="cp_img">'.
                                        '<img class="img-fluid2 img-fluid" src="../uploads/stock_agence_A/'.$row->image.'">'.
                                        '<div class="hover">'.
                                            //'<form action="{{route("shopping_cart")}}" method="POST" onsubmit="return false">'.
                                            '<input type="hidden" name="" id="product_id" value="'.$row->id.'"/>'.
                                            '<input type="hidden" name="id_name"id="id_name" value="'.$row->title.'"/>'.
                                            '<input type="hidden" id="product_price_min" value="'.$row->price_min.'"/>'.
                                            '<button type="submit" class="btn btn-primary btn-sm waves-effect" name="add_to_cart_name" onclick="getContent()" id="add_to_cart">'.
                                                '<i class="zmdi zmdi-plus"></i>'.
                                            '</button>'.
                                            //'</form>'.
                                            '<a href="javascript:void(0);" class="btn btn-danger btn-sm waves-effect"><i class="zmdi zmdi-shopping-cart"></i></a>'.
                                        '</div>'.
                                    '</div>'.
                                    '<div class="product_details">'.
                                        '<h5>'.'<input readonly class="input_commande" type="text" data-id="'.$row->id.'" value="'.$row->title.'"/></h5>'.
                                        '<ul class="product_price list-unstyled">'.
                                            '<li class="old_price">'.$row->price_min.'  Fcfa</li>'.
                                        '</ul>'.
                                    '</div>'.
                                '</div>'.
                            '</div>'.
                        '</div>';
                $i++;
            }
            return $output;  
 
         }
        }

    }
    public function shopping_cart(Request $request){

        Cart::add('232324', 'values_id', 1, 9.99);
        return Cart::content();

    }
    
}

@extends('agence_A.agence_A')
@section('content')
<script src="{{asset('js/jquery.min.js')}}"></script>

<section class="content ecommerce-page">
    <div class="block-header">
        <div class="row">
            <div class="col-lg-7 col-md-6 col-sm-12">
                <h2>La Commande
                    <small>Bienvenue sur Unity Construction</small>
                </h2>
            </div>
            <div class="col-lg-5 col-md-6 col-sm-12">
                <ul class="breadcrumb float-md-right">
                    <li class="breadcrumb-item"><a href=""><i class="zmdi zmdi-home"></i> Unity Construction</a></li>
                    <li class="breadcrumb-item active">La Commande</li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container-fluid">
        <div class="row clearfix">
            <div class="col-lg-12">
                <div class="card product_item">
                    <div class="body">
                        <table class="table-responsive table">
                            <thead>
                            <tr>
                                <td>Unity Construction</td>
                                <td> </td>
                                <td> </td>
                            </tr>
                            <tr>
                                <td class="td_command">Nom client : <span class="span_command">{{ $client_agence_A->name_client }}</span></td>
                                <td>Fait le: <span class="span_command">{{ date('Y-m-d H:i:s') }}</span> </td>
                            </tr>
                            <tr>
                                <td>Entreprise client : <span class="span_command">{{ $client_agence_A->entreprise_client }}</span></td>
                                <td class="td_command">A :</td>
                            </tr>
                            </thead>
                        </table>
                        <table id="DataTable" class="table table-hover m-b-0">
                            <thead>
                            <tr>
                                <th class="xs-small" data-breakpoints=" xs">N.</th>
                                <th>Designation</th>
                                <th>Prix Unitaire</th>
                                <th class="quantity-small-td" data-breakpoints="quantity-small-td">Commandé</th>
                                <th class="quantity-small-td" data-breakpoints="quantity-small-td">Livré</th>
                                <th class="quantity-small-td" data-breakpoints="quantity-small-td">Reste a Livrer</th>
                                <th data-breakpoints="cs">Total</th>
                            </tr>
                            </thead>
                            <tbody id="shopping_cart">
                                
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td  style="border: 1px solid dimgrey" colspan="5" align="right">Remise</td>
                                    <td colspan="2"></td>
                                </tr>
                                <tr>
                                    <td colspan="5" align="right"> Total</td>
                                    <td id="total_facture" colspan="2"></td>
                                </tr>
                            </tfoot>
                        </table>
                        <div class="form-group">
                            <br/>
                            <br/>
                            <button type="submit" class="btn btn-width btn-success">
                                <i class="fa fa-btn fa-sign-in"></i>Envoyer la commande au magazinier
                            </button>
                            <a href="/agence_A">
                                <button class="btn btn-danger">
                                    <i class="fa fa-btn fa-sign-in"></i>Cancel
                                </button>
                            </a>
                        </div>
                            <br/>
                            <br/>
                            <h2>Selectionner les articles</h2>
                            <br/>
                            <div class="form-group">
                                <input type="text" class="form-control lonf" id="search" name="search" value="" placeholder="Search.."/> 
                            </div>
                            <br/>
                            <br/>
                            <br/>
                            <br/>
                        <div class="container-fluid">
                            <div class="row clearfix" id="tbody">
                                
                            </div>
                        </div>
                        <!--<script>
                            function insert_commande0() {
                              document.getElementById("name_product0").value = document.getElementById("title_product0").value;
                            }
                            function insert_commande1() {
                              document.getElementById("name_product1").value = document.getElementById("title_product1").value;
                            }
                        </script>-->
                        <script type="text/javascript">
                            const search = document.getElementById('search');
                            const tableBody = document.getElementById('tbody');
                            function getContent(){
                            
                            const searchValue = search.value;
                            
                                const xhr = new XMLHttpRequest();
                                xhr.open('GET','{{route('search_client')}}/?search=' + searchValue ,true);
                                xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
                                xhr.onreadystatechange = function() {
                                    
                                    if(xhr.readyState == 4 && xhr.status == 200)
                                    {
                                        tableBody.innerHTML = xhr.responseText;
                                    }
                                }
                                xhr.send()
                            }
                            search.addEventListener('input',getContent);
                        </script>

                        <!--
                            <script type="text/javascript">

                                    function cart_add() {
                                        //var product_id_var = document.getElementById('product_id');
                                        
                                        var i = 0;
                                        var product_id_var = $( "#product_id" ).val();
                                        var product_title_var = $( "#product_title" ).val();
                                        var product_price_min_var = $( "#product_price_min" ).val();
        
                                        var product_bill = new Array;
                                        product_bill[0] = product_id_var;
                                        product_bill[1] = product_title_var;
                                        product_bill[2] = product_price_min_var;
        
                                        //document.write(product_bill);
                                        text = "<td>" + product_bill[0] + "</td>";
                                        text += "<td>" + product_bill[1] + "</td>";
                                        text += '<td>'+'<input type="number" value="'+product_bill[2]+'" name="prix_product_bill" placeholder="PRIX de vente du Produit" id="prix_product_bill">'+'</td>';
                                        text += '<td>'+'<input type="number" value="" min="1" name="quantity_product_bill" placeholder="Quantite commande" id="quantity_product_bill">'+'</td>';
                                        text += '<td>'+'</td>';
                                        text += '<td>'+'</td>';
                                        text += '<td id="total_price">'+'</td>';

                                        document.getElementById("shopping_cart").innerHTML = text;
                                        total_price = parseInt(product_bill[2]) + 1;
                                        document.getElementById("total_price").innerHTML = total_price;

                                    }
                                </script>
                                <script>
                            $(document).ready(function(){

                                $( "#add_to_cart" ).click(function() {
                                    alert( "Handler for .click() called." );
                                });

                            });
                        </script>
                            --->
                            <script type="text/javascript">
                                //const add_to_cart = document.getElementById('add_to_cart');
                                function getContent(){
                                    
                                const add_to_cart_id = document.getElementById('product_id').value;
                                
                                    const xhr = new XMLHttpRequest();
                                    xhr.open('GET','{{route('shopping_cart')}}' ,true);
                                    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
                                    xhr.onreadystatechange = function() {
                                        
                                        if(xhr.readyState == 4 && xhr.status == 200)
                                        {
                                            shopping_cart.innerHTML = xhr.responseText;
                                        }
                                    }
                                    xhr.send()
                                }
                                //add_to_cart.click('button',getContent);
                            </script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/


Auth::routes();


Route::get('/home', 'HomeController@index')->name('home');

Route::get('/', function(){
    return view('welcome');
});


//Route::get('/','welcomeController@index')->name('welcome');

Route::group(['middleware' => ['auth', 'admin']], function(){

    Route::get('/dashboard', function(){
        return view('dashboard.dashboard');
    });

    Route::get('/dashboard','UserController@index')->name('dashboard.index');

    Route::get('/dashboard','ProductController@index')->name('products.index');

    Route::get('/role-register', 'Dashboard\DashboardController@registered')->name('dashboad.register.registered');

    Route::get('/role-edit/{id}', 'Dashboard\DashboardController@registeredit')->name('dashboad.register-edit.registeredit');

    Route::put('/role-register-update/{id}', 'Dashboard\DashboardController@registerupdate');

    Route::delete('/role-delete/{id}', 'Dashboard\DashboardController@registerdelete');

    Route::get('/best_product', 'Dashboard\best_productController@index')->name('dashboad.best_product.index');


});


Route::group(['middleware' => ['auth', 'Chef_agence_A']], function(){

    Route::get('/agence_A', function(){
        return view('agence_A.agence_A');
    });

    Route::get('/agence_A','Chef_agence_AController@index')->name('agence_A.index');

    Route::get('/agence_A','agence_A\all_productController@index')->name('all_product.index');

    Route::get('/add_product', 'agence_A\add_productController@index')->name('agence_A.add_product.index');

    Route::post('/form_add_product', 'agence_A\add_productController@form_add_product')->name('form_add_product');

    Route::get('/list_product', 'agence_A\list_productController@index')->name('agence_A.list_product.index');

    Route::get('/product-edit/{id}', 'agence_A\list_productController@productedit')->name('agence_A.product-edit.productedit');

    Route::get('/show_product/{id}', 'agence_A\list_productController@productshow')->name('agence_A.show_product.productshow');

    Route::put('/product-update/{id}', 'agence_A\list_productController@productupdate');

    Route::delete('/product-delete/{id}', 'agence_A\list_productController@productdelete');
    

    Route::get('/search_products', 'agence_A\list_productController@search_products')->name('agence_A.search_product.index');
    Route::get('/search_product', 'agence_A\list_productController@search_product')->name('search_product');
    //Route::get('/live_search', 'agence_A\liveSearchController@index')->name('agence_A.live_search.index');

    //Route::get('/search', 'agence_A\liveSearchController@search')->name('agence_A.live_search.search');

    Route::get('/autocomplete', 'agence_A\liveSearchController@autocomplete')->name('agence_A.live_search.autocomplete');

    /**
     * client
     */

    Route::get('/client_add', 'agence_A\clientController@client_add')->name('agence_A.client_add.client_add');

    Route::post('/form_client_add', 'agence_A\clientController@form_client_add')->name('form_client_add');

    Route::get('/add_client', 'agence_A\clientController@index')->name('agence_A.add_client.index');

    Route::get('/search','agence_A\clientController@search')->name('search');    

    Route::get('/list_client', 'agence_A\clientController@list_client')->name('agence_A.list_client.list_client');

    Route::get('/client-edit/{id_client}', 'agence_A\clientController@clientedit')->name('agence_A.client-edit.clientedit');

    Route::get('/show_client/{id_client}', 'agence_A\clientController@clientshow')->name('agence_A.show_client.clientshow');

    Route::put('/client-update/{id_client}', 'agence_A\clientController@clientupdate');

    Route::delete('/client-delete/{id_client}', 'agence_A\clientController@clientdelete');

    /**
     * facture
     */

    Route::get('/facture', 'agence_A\factureController@index')->name('agence_A.facture.index');

    Route::get('/commande/{id}', 'agence_A\factureController@commande')->name('agence_A.commande.commande');

    Route::get('/search_client', 'agence_A\factureController@search_client')->name('search_client');

    

    Route::get('/shopping_cart', 'agence_A\factureController@shopping_cart')->name('shopping_cart');

});

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class ClientAgenceA extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        //
        Schema::create('client_agence_A', function (Blueprint $table) {
            $table->bigIncrements('id_client');
            $table->string('name_client');
            $table->string('adress_client');
            $table->string('telephone_client');
            $table->string('entreprise_client');
            $table->string('sexe_client');
            $table->bigInteger('account_client');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        //
    }
}

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class StockAgenceA extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        //
        Schema::create('stock_agence_A', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('referent');
            $table->string('title');
            $table->string('description');
            $table->string('category');
            $table->decimal('quantity');
            $table->double('price_min', 25, 5);
            $table->double('price_max', 25, 5);
            $table->decimal('alarm_stock');
            $table->mediumText('image')->nullable();
            $table->string('product_type');
            $table->string('provider');
            $table->double('tax');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        //
    }
}
Mon index.blade dont qui est appele:
<code html>
<!--doctype html-->
<html class="" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <meta content="Stock management template" name="description">
    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <link rel="stylesheet" href="{{asset('/css/dataTables.min.css')}}"/>

    <!--STYLES
        <title>{{ config('app.name', 'Laravel') }}</title>
    -->
    <title>Unity Construction</title>
    <!--STYLES-->
    @include('includes.agence_A.styles')
    </head>
<body class="theme-purple">
<!-- Page Loader -->

<!-- Overlay For Sidebars -->
<div class="overlay"></div>

<!-- Top Bar -->
@include('includes.agence_A.topbar')
<!-- Left Sidebar -->
@include('includes.agence_A.navbar')

<!-- Right Sidebar -->
@include('includes.agence_A.right_sidebar')

<!-- Chat-launcher -->
<div class="chat-launcher"></div>
<div class="chat-wrapper"></div>
@yield('content')
@include('includes.agence_A.footer')

@yield('extra-js')
<script src="{{asset('/js/pages/welcome/jquery.min.js')}}"></script>

</body>
</html>