Level 50
Do you have form closing tag?
1 like
Aug 7, 2017
7
Level 1
Laravel use ajax on item list
Hello,
i want to update a boolean attribute with one click with an ajax request I have students that can be absents
here is my view
| User | Justified |
| ------ | ---------- |
| Sam | Yes |
| John | No |
| Doe | Yes |
| Jack | No |
| ...... | ......... |
My problem is that when il click on it to update the "justified" attribute, it change the page and show me a blank page with the result of justifiedToggle function ("Success for xx").
here is my form foreach users
<form action="'.route('absence.justifiedtoggle').'" method="POST" class="formJustifiedToggle">
<input name="_method" type="hidden" value="POST">
<input name="absence_id" type="hidden" value="'.$absence->id.'">
<input name="_token" type="hidden" value="'.csrf_token().'">
my route
Route::post('absence/justifiedtoggle', 'AbsenceController@justifiedToggle')->name('absence.justifiedtoggle');
and my controller
public function justifiedToggle(Request $request){
$absence = Absence::findOrFail($request->get('absence_id'));
$absence->toggleJustified()->save(); // if false put true, if true put false
return 'Success for '. $absence->id;
}
Here my js
$('.formJustifiedToggle').submit(function(e){
e.preventDefault();
$.ajax({
method: 'POST',
url: APP_URL + '/absence/justifiedtoggle',
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
}).done(function( msg ) {
console.log( "Response: " + msg );
});
});
thanks for your time som
Level 1
yes sorry i missed it
<form action="<?php route('absence.justifiedtoggle'); ?>" method="POST" class="formJustifiedToggle">
<input name="_method" type="hidden" value="POST">
<input name="absence_id" type="hidden" value="<?php $absence->id; ?>">
<input name="_token" type="hidden" value="<?php csrf_token(); ?>">
<button type="submit"><?php ($absence->justified) ? "yes" : "no"; ?></button>
</form>
in the page, i have lot of that form something like that
<form action="http://localhost:8888/phpStorm/ibnalqayyim/public/absence/justifiedtoggle" method="POST" style="display: inline-block" class="formJustifiedToggle">
<input name="_method" type="hidden" value="POST">
<input name="absence_id" type="hidden" value="5">
<input name="_token" type="hidden" value="5qkEa47SHs5v3sNwCQUakt2HFoo9VMMABs8KNXVZ">
<button type="submit">Yes</button></form>
<form action="http://localhost:8888/phpStorm/ibnalqayyim/public/absence/justifiedtoggle" method="POST" style="display: inline-block" class="formJustifiedToggle">
<input name="_method" type="hidden" value="POST">
<input name="absence_id" type="hidden" value="6">
<input name="_token" type="hidden" value="5qkEa47SHs5v3sNwCQUakt2HFoo9VMMABs8KNXVZ">
<button type="submit">No</button></form>
<form action="http://localhost:8888/phpStorm/ibnalqayyim/public/absence/justifiedtoggle" method="POST" style="display: inline-block" class="formJustifiedToggle">
<input name="_method" type="hidden" value="POST">
<input name="absence_id" type="hidden" value="7">
<input name="_token" type="hidden" value="5qkEa47SHs5v3sNwCQUakt2HFoo9VMMABs8KNXVZ">
<button type="submit">No</button></form>
Level 50
What browser's console says? Any errors? Do you see the request? https://jsfiddle.net/4yshwqx1/ Everything should be fine. Try to "console.log" every single step and see what would you get. For example, if you only leave
e.preventDefault();
console.log('submitting');
1 like
Level 1
Nothing,
i tried with
$('.submitButton').click(function(e){
e.preventDefault();
console.log('clicked');
});
and with
$('.formJustifiedToggle').submit(function(e){
e.preventDefault();
console.log('submiting')
});
Looks like the js doesnt run... i cant prevent the submitting
Level 50
Try to wrap you js code with
$(document).ready(function() {
$('.formJustifiedToggle').submit(function(e){
e.preventDefault();
console.log('submiting')
});
});
1 like
Level 1
Still not, I probably have a problem with javascript
im using datatables to list the data, perhaps its causing problem
Level 1
Please or to participate in this conversation.