Ajax POST request fails with status code 400 but I have no idea why
Ajax POST request fails with status code 400 but I have no idea why
marcusb123
Posts: 3Questions: 1Answers: 0
I am making a Ajax POST request for DataTables like so:
var table = $('#ops-br-table').DataTable({
serverSide: true,
pageLength: 25,
processing: true,
language: {
loadingRecords: "Loading...",
processing: "Loading..."
},
ajax: {
url: '/mywebsite/requests/filter',
type: 'POST',
contentType: "application/json;",
dataType: 'json',
traditional: true,
data: function (d) {
return JSON.stringify(d);
}
},
columns: [
{
data: 'propertyName1',
visible: false
},
{
data: 'propertyName2',
className: 'nowrap',
type: 'date',
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'propertyName3',
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'tourId',
width: "5%",
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'tourDetail.tourName',
width: "10%",
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'userComment',
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'user.friendlyIdentifier',
width: "10%",
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'user.email',
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'sentDate',
className: 'nowrap',
type: 'date',
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'firstChaseDate',
className: 'nowrap',
type: 'date',
render: function (data, type, row) { return doStuff(data); }
},
{
data: 'secondChaseDate',
className: 'nowrap',
type: 'date',
render: function (data, type, row) { return doStuff(data); }
},
{
data: function (row, type, val, meta) { return doStuff(row); }
},
{
data: function (row, type, val, meta) { return doStuff(row); }
className: 'nowrap'
},
{
data: function (row, type, val, meta) { return doStuff(row); }
className: 'nowrap'
}
],
order: [
[ 1, "desc"]
],
initComplete: function () {
var api = this.api();
new $.fn.dataTable.Buttons(api, {
buttons: [
{
text: 'Thing Done',
className: 'btn-primary btn-sm',
action: function (e, dt, node, config) {
tap.operations.brochurerequests.index.brochureSent(dt);
}
},
{
text: 'First Chase Sent',
className: 'btn-primary btn-sm',
action: function (e, dt, node, config) {
doStuff(dt);
}
},
{
text: 'Second Chase Sent',
className: 'btn-primary btn-sm',
action: function (e, dt, node, config) {
doStuff(dt);
}
}
]
});
},
drawCallback: function (settings) {
doStuff.colourRows(new $.fn.dataTable.Api(settings));
$('[data-toggle="tooltip"]').tooltip();
}
});
I have an ASP.net view that calls the POST request above:
<div class="page-interactions-br-search">
<div class="header header-page">
<div>
<h2>Requests</h2>
</div>
</div>
<table id="ops-br-table" class="table-full-width table table-striped table-narrow-col">
<thead>
<tr>
<th></th>
<th>Requested</th>
<th>Company</th>
<th>Product Id</th>
<th>Product Name</th>
<th>Comments</th>
<th>Name</th>
<th>Email</th>
<th>Contact Sent</th>
<th>Email Sent</th>
<th>2nd Email Sent</th>
<th>Booked</th>
<th>Due</th>
<th>Overdue</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
@section Scripts {
<script type="text/javascript">
$(document).ready(function () {
mywebsite.requests.index.load(); // This calls a script that fires off the POST request above
});
</script>
}
The post request should go via my controller, which looks like this, but the breakpoint in my controller's post method is never hit:
[Route("MyWebsite/Requests")]
public class RequestsController : Controller
{
private readonly RequestService requestService;
public BrochureRequestsController(RequestService requestService)
{
this.requestService = requestService;
}
// GET: requests
public IActionResult Index()
{
return View();
// Returns the view above
}
// POST: requests/filter
[Route("filter")]
public IActionResult Filter([FromBody]DataTablesRequest request)
{
// This is never hit, I get an HTTP 400 Bad Request error before this is hit or maybe something is preventing this
// breakpoint from being reached. I am confused.
I have no idea why I can't hit the breakpoint in my controller and why the request fails before that.
It looks like there is some invalid configuration in my POST request but I am new to this and I have no idea what's going wrong.
Any help would be VASTLY appreciated as I am losing a lot of time to this issue!
Let me know if I can provide more info.
This discussion has been closed.
Answers
this is what the request headers look like:
ok never mind, my issue was actually that my breakpoint was never being hit in Visual Studio as I didn't launch my app with IIS Express - weird.
There was no issue with the above Ajax call, the problem was obviously purely server-side as the HTTP error suggests, I just wasn't able to follow the call into the server which was intensely confusing.