freel's avatar

Laravel values in blade template using Ajax

Hello, it is my first try to use ajax, so if my question is very stupid just write like that :) I want to understand one thing, is possible to return to blade template using ajax values properly. and latter do in blade template @foreach ... @if and so on. What i find out now all response coming back to , that mean that i will nee all my html code write in jquery side or controller, what I would like to avoid. Here is what i have now: Blade view:

<div class="col-md-6">
<label>Plate number</label>
<input type="text" id="plate" class="form-control" name='plate_number' placeholder="Enter your car plate number" required>
<button id='find' class="btn btn-primary pull-right">Find</button>
 <div id="result"></div> <!-- in this area i am getting answer from ajax --> 
<!-- I would like to see use here values like {{$data['plate_number']}} and so on. -->
<div class="clearfix"></div>
</div>

ajax file:

$("#find").click(function(e){
    e.preventDefault();
    var plate = $("#plate").val();
    $.ajax({
        url : "/ajax",
        data : 'plate_number='+plate,
        success : function(data){
            $('#result').html(data);
        }
    });
});

controller

 // Function ajax
        public function ajax(Request $request){
            if (\Request::ajax()) {
                $data = array(Input::get('plate_number'),'Auto','200Eur');
                return json_encode($data);
            }
        }

Sorry for my stupid question and thank you for your help.

0 likes
8 replies
jekinney's avatar

Blade view helpers compile down to php code. Php is read server side before sending the page to the browser so you can't run php code on the fly. So no.

I suggest using InnerHtml it append your data to the view with JavaScript and HTML.

freel's avatar

Not sure I understand what you mean. Any chance to drop me quick example please? thx

Gerard's avatar

@freel Blade is executed before page load, and ajax comes after blade. So you can't use blade (PHP) for your AJAX results, because blade was executed before AJAX.

It's like if you want to handwrite in a document and transform it according to what you write. You can have a digital version of the document that you can edit, but the printing process is like blade and handwritting is like AJAX. You can't handwrite before print the document.

freel's avatar

oh... I see. so where you placing your html? generating it in controller and latter sending it back? or u generating in js file?

Gerard's avatar
Gerard
Best Answer
Level 5

@freel In the first place blade generates your first HTML from your view.blade.php executing all the php and blade code, and then this code disappears, it's a server side process. Later, you can use javascript to modify/delete/add your HTML DOM elements based in your AJAX results, which are client side processes.

I know very little about Ajax, so I can't help you with it's processes. It's only to explain you why isn't possible to do what you want in the first instance, you can't do a client side process in a server side process. Take a look at what @jekinney recommended, maybe it can help you.

Snapey's avatar

If you just want to insert pre-formatted html into your page, have a look into pjax - there are tutorials on Laracasts.

If your ajax call just contains data then you need to write javascript to merge this into the browser DOM.

talentedaamer's avatar

I had the same problem, but i could not pass the $exam->id. I added a dummy value and then replaced it with the value of option on select change.

var ajaxUrl = "{{ route('api.v1.exams.grades.index', -1 ) }}";
if ( examSelect.value !== '' ) {
    ajaxUrl = ajaxUrl.replace('-1', examSelect.value);
    populateSelect(ajaxUrl, gradeSelect);
}
                

Please or to participate in this conversation.