How to use POST in AJAX and Plain JavaScript?

Question

Edit

I am trying to update my ```model`` via Ajax. These are the process i have undergone. In my view, I have two buttons, one for In Progress and another for Not In Progress, so in my JavaScript I have this function:

document.getElementById("btn-task-inprogress").addEventListener("click", function(){
    var httpRequest = new XMLHttpRequest();
    var id = document.getElementById("id").value;
    var token = document.getElementsByTagName('input').item(name="_token").value;
    var data = "_token="+token;
    var urlRequest = "http://"+window.location.hostname+":"+window.location.port+'/task/edit/'+id+'/In Progress';

    httpRequest.open("POST", urlRequest, true);
    httpRequest.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    httpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    httpRequest.send(data);
    });

and In my controller, i made this function:

public function customEdit($id, $item){
    dd($id.' >>> '.$item);
    Task::where('id', 'like', $id)->update(['status' => $item, 'updated_at' => Carbon::now()])->first();
    //return view('task.edit', compact('task'));
}

and this is my routes definition, in web.php:

Route::post('/task/edit/{id}/{item}', 'TaskController@customEdit');

My problem now is if i clicked my button, it gives me this error: style.js:368 POST http://127.0.0.1:8000/task/edit/3/In%20Progress 500 (Internal Server Error).

How to use POST in AJAX and Plain JavaScript?

0 Answers0