Laravel: rendering partial views with AJAX requests

Question

I am trying to make a single page CRUD application and I am using AJAX with jQuery. In this case, I submit the form and store a new country in my database asynchronously and then render a partial view with the new data.

This is my script and the method that retrieves the countries from the database and returns the partial view.

$('#create-country-form').submit(function(event) {
    $.post('/country/store', $('#create-country-form').serialize(), function() {
        $.get('/country/all', function(data) {
            $('#countries-table').empty();
            $('#countries-table').append(data['html']);
        });
    });
    event.preventDefault();
});

class CountryController extends BaseController {

    public function all() {
        $countries = Country::All();

        $html = View::make('countries.list', compact('countries'))->render();

        return Response::json(['html' => $html]);
    }

    // ...

}

However, I don't like the idea of actually rendering the view in the page using jQuery, it feels like this should be Laravel's work.

How can I render with Laravel a partial view along with the use of AJAX, and not having to delegate that work to jQuery (append() and empty())?

Answer 1

Pass your view to view helper, render it into a variable and return that variable as response to AjAx.

$view=view('your-view-blade');
$view=$view->render();
$responseData->responseSuccess($view);

In callback of your AjAx you can use that rendered HTML, you are free to append that HTML to any element.

Answer 2

Use string method before view file

return (String) view('Company.allUserAjax');