Simple AJAX call to update a table with the content coming from a mySQL table

@P81CFM Have you got started with Laravel yet? If so, can you update this post with code and where exactly you need help? If not, you could actually get started with a tutorial like this: https://laracasts.com/series/laravel-from-scratch-2017

I started with Laraval I was looking for direction not for code.

So far I've just the HTML code the first problem was to interact with AJAX

contenteditable the table td , on focus update your input , on blur update to the database , done.

1. You need a controller that takes the request, validates it and passes it to a handler. Usually a method within the controller.
2. Your JS libraries like jQuery are loaded from a layout file.
3. Page specific scripts are loaded from a view which controller renders.

So, yeah, get started and dirty up your hands :)

@P81CFM route file

Route::get('ajax-call', 'SomeController@get')

Jquery

$.ajax( {
            url     : "http://localhost/ajax-call", // same as in route file
            type    : "GET",
            dataType: "JSON",
            context : this,
            data    : {datas},
            success : function( res ) {
                var html = '<tr> <td> ur result </td> </tr>';
                $(table).append(html); 
            },
            error   : function() {
                console.log( "Ajax Not Working" );
            }
        } );

SomeController

Class SomeController {

public function get() {
    get the result and return as json
}

}

Thank you guys

I haven't move much to be honest but I have the idea a bit more clear

Route file

Route::get('/adm/countries/ajax-get/', 'CountriesController@ajax_get');

Within the blade file after the table I have this js code

<script type="text/javascript">

      $(function(){
        $('#countries').change(function () {
          url:"/adm/countries/ajax-get/",
          type:'GET',
          datatype:'JSON',
          context: this,
          data: {datas},
          success: function( res ) {
              var html = res;
              $('#tbl_countries').append(html); 
          },
          error: function() {
              console.log( "Ajax Not Working" );
          }

        });
    });

    </script>

Not quite sure about the Controller, the idea is to query the table with the value of the dropdownmenu and return the countries one for each html . I thought about returning a view with the html (I also changed the datatype in the JS code) to append to the table.

public function ajax_get(){

    $countries = Country::get();

    return view('admin.countries.ajax-result', compact('countries'));
}

Nothing is happening

You're not actually making an ajax call...

$('#countries').change(function (e) {
    e.preventDefault();

    // get the value of the dropdown
    let selectedValue = $(this).val();

    // make the ajax call (needs to be POST since you're sending data)
    $.ajax({
          url:"/adm/countries/ajax-get/",
          type:'POST',  // change your route to use POST too
          datatype:'JSON',
          context: this,
          data: {value: selectedValue},  // set the data from the dropdown
          success: function( res ) {
              //var html = res;// no need to waste a variable, just use it directly
              $('#tbl_countries').append(res); 
          },
          error: function() {
              console.log( "Ajax Not Working" );
          }
    });
});

//use post since you're sending data
Route::post('/adm/countries/ajax-get/', 'CountriesController@ajax_get');

public function ajax_get(Request $request) {
    //here you should do your form validation...

    // get the value that we sent from ajax, I called it "value"
    $valueFromDropdown = $request->value;

    // use the value from the dropdown to get the country
    // adjust how needed
    $countries = Country::where('id', $valueFromDropdown)->first();

    return view('admin.countries.ajax-result', compact('countries'))->render();
}

I'm sure this won't work 100% as is since I don't know the rest of your code.

Fantastic!