Level 5
what error you are getting can you please let us know ??
May 12, 2017
12
Level 1
Ajax Post Request not working
Ajax post method is not posting. Instead it returns http://localhost:8000/hr/dashboard?_token=uPbr4kRq7 3vp1BuRiUpViEiZNWy1aqyiulST3VAb&jobtitle=fggffffff#
php script
@foreach (array_chunk($jobs->all(), 2) as $jobRow)
@foreach ($jobRow as $job) <div class="col-md-6">
<div class="panel border-left-lg border-left-primary">
<div class="panel-body">
<div class="row">
<div class="col-md-8">
<h6 class="no-margin-top"><a href="task_manager_detailed.html">{{$job->jobtitle}}</a></h6>
<p class="mb-15">{{$job->jdesc}}</p>
<a href="#"><img src="/assets/images/placeholder.jpg" class="img-circle img-xs" alt=""></a>
<a href="#"><img src="/assets/images/placeholder.jpg" class="img-circle img-xs" alt=""></a>
<a href="#"><img src="/assets/images/placeholder.jpg" class="img-circle img-xs" alt=""></a>
<a href="#" class="text-default"> <i class="icon-plus22"></i></a>
</div>
<div class="col-md-4">
<ul class="list task-details">
<li> Experience : {{$job->exp}}</li>
<li class="dropdown">
Priority:
<a href="#" class="label label-primary " data-toggle="dropdown">{{$job->jobp}} <span class="caret"></span></a>
</li>
<li><a href="#"> Salary: {{$job->salary}}</a></li>
</ul>
</div>
</div>
</div>
<div class="panel-footer panel-footer-condensed">
<div class="heading-elements">
<span class="heading-text">Posted at: <span class="text-semibold">{{$job->created_at}}</span></span>
<ul class="list-inline list-inline-condensed heading-text pull-right">
<li class="dropdown">
<a href="#" class="text-default dropdown-toggle" data-toggle="dropdown">Open <span class="caret"></span></a>
<ul class="dropdown-menu dropdown-menu-right">
<li class="active"><a href="#">Open</a></li>
<li><a href="#">Hired</a></li>
<li><a href="#">Closed</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="text-default dropdown-toggle" data-toggle="dropdown"><i class="icon-menu7"></i> <span class="caret"></span></a>
<ul class="dropdown-menu dropdown-menu-right">
<li><a href="#"><i class="icon-rotate-ccw2"></i> Reassign</a></li>
<li class="divider"></li>
<li><a class="edit" onclick='return somefunction()' href="#"><i class="icon-pencil7"></i> Edit Job</a></li>
<li><a href="{{route('job.delete',['job_id' => $job->id])}}"><i class="icon-cross2"></i> Remove</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
@endforeach
</div>
@endforeach
ajax script
/**************/
var jobId = 0; var JobTitleElement = null;function somefunction() { JobTitleElement =event.target.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.childNodes[1].childNodes[1].childNodes[1].childNodes[1];
var jobTitle = JobTitleElement.textContent;
JobId = event.target.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.dataset['jobid'];
$('#modal-editjob').modal();
$('#jobtitle').val(jobTitle);
} function somfunction() {
$.ajax({
method: 'post',
url: '/hr/editjob',
data: {jobtitle: $('#jobtitle').val(), JobId: JobId, _token: token}
})
.done(function (msg) {
$(jobTitleElement).text(msg['new_body']);
$('#edit-modal').modal('hide');
});
}
/**************/web.php
/**************/
Route::prefix('hr')->group(function(){ Route::get('/dashboard', 'JobController@getDashboard')->name('hr.dashboard'); Route::get('/home', 'HomeController@index'); Route::post('/picupdate', [
'uses' => 'PicController@update_avatar',
'as' => 'pic.update',
]);
Route::post('/postjob',[
'uses'=> 'JobController@postCreateJob',
'as'=>'job.create',
]);
Route::post('/editjob',[
'uses'=> 'JobController@editjob',
'as'=>'editjob',
]);
/**************/
##editjob function: /**************/
public function editjob(Request $request) {
$job = Job::find($request['jobId']);
$job->jobtitle = $request['jobtitle'];
$job->update();
return redirect('/hr/dashboard')->with(['messages'=> 'Job Edited']);
}
/**************/
pop up model
/**************/
<!-- Registration form -->
<div id="modal-editjob" class="modal fade">
<div class="modal-dialog">
<div class="modal-content login-form">
<!-- Basic layout-->
<form >
<div class="panel panel-flat">
<div class="panel-heading">
<h5 class="panel-title">Edit Job</h5>
<div class="heading-elements">
<ul class="icons-list">
<li><a data-action="collapse"></a></li>
</ul>
</div>
</div>
<div class="panel-body">
<input type="hidden" value="{{Session::token()}}" name="_token">
<div class="form-group">
<label>Job Title:</label>
<input type="text" class="form-control" name="jobtitle" id="jobtitle" >
</div>
<div class="text-right">
<button type="submit" onclick='return somfunction()' class="btn btn-primary">Edit Job <i class="icon-arrow-right14 position-right" ></i></button>
</div>
</div>
</div>
</form>
<!-- /basic layout -->
</div>
</div>
</div>
<!-- /Job form -->
/**************/
Level 75
See https://laracasts.com/discuss/channels/laravel/need-some-advice-on-saving-a-ajax-form-data-into-l5 My reply was tested and works. Cleaned up some
$(function () {
$("#postjq").click(function (event)
{
event.preventDefault();
var $post = {};
$post.petid = $('#petid').val();
$post.species = $('#species').val();
$post._token = document.getElementsByName("_token")[0].value
$.ajax({
url: '<?php echo "petupdate"; ?>',
type: 'POST',
data: $post,
cache: false,
success: function (data) {
return data;
},
error: function () {
alert('error handing here');
}
});
});
});
All I know is this works.
Level 47
1 please clean your code 2 where is your controller code
Level 75
Remember this was a quick test to help someone
public function petupdate(Request $request)
{
$petid = $request->input('petid');
$species = $request->input('species');
$postdata = [
'species' => $species
];
DB::table('pets')
->where('petid', $petid)
->update($postdata);
return redirect(Session::get('areturn'));
}
And top of controller needs
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
1 like
Level 1
send @ jquery.min.js:4 ajax @ jquery.min.js:4 somfunction @ dashboard:67 onclick @ VM3743 dashboard:787
jquery.min.js:4
POST http://localhost:8000/hr/editjob 500 (Internal Server Error) getting this error on console
Level 1
i think error is because of my controller part public function jobeditJob(Request $request) {
$this->validate($request, [
'jobtitle' => 'required'
]);
$job = Job::find($request['jobId']);
if (Auth::user() != $job->user) {
return redirect()->back();
}
$job->jobtitle = $request['jobtitle'];
$job->update();
return response()->json(['new_body' => $job->jobtitle], 200);
}
i have put csrftoken exception for the url
Level 1
this is ajax script part
<script type="text/javascript">
var jobId = 0;
var JobTitleElement = null;
function somefunction()
{
JobTitleElement =event.target.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.childNodes[1].childNodes[1].childNodes[1].childNodes[1];
var jobTitle = JobTitleElement.textContent;
jobId = event.target.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.dataset['jobid'];
$('#modal-editjob').modal();
$('#jobtitles').val(jobTitle);
}
function somfunction()
{
event.preventDefault();
$.ajax({
method: "post",
url: urlEdit,
data: {
'jobtitle': $('#jobtitles').val(),
'jobId':jobId,
}
})
.done(function () {
$('#modal-editjob').modal('hide');
});
}
</script>
it works fine as when i console.log() jobId and $('#jobtitles').val() i get correct string values. and when i put the contoller part empty the .done(function()) works fine
Level 1
i tried ur method got same error i did dd($postdata); in my controller and got a long script
Level 5
can you please write success and fail function in ajax and try to print data in console.log so that you can have idea about whats wrong in controller
Level 1
@ershakti Done that while i return a string from my controller got success message in alert() and when i done my script inside controller got error message in alert();
if i share my bitbucket repo can anyone help me on this? stuck for days
1 like
Level 5
yes sure please share that i think it might be helpfull
Level 1
Please or to participate in this conversation.