When selecting an item from a bootstrap dropdown, I need to be updating a property on the page model to reflect the selection.
To achieve this, I'm doing an ajax post with jquery to the handler method:
function setStream(streamId, streamName) {
// If streamId is NaN or undefined, set to 0, assuming user is viewing all streams.
streamId = (streamId === NaN || streamId === undefined) ? 0 : streamId;
console.log(`setStream(${streamId}, ${streamName})`);
streamName = streamName === undefined ? "All streams" : streamName;
$("#Booking_Stream_Id").val(streamId);
$("#titleStream").html(`| ${streamName}`);
// Update the stream on the model.
const _streamId = parseInt(streamId);
$.ajax({
method: "GET",
url: "/Index?handler=Stream?newStreamId=" _streamId,
headers: {
"RequestValidationToken": "@token"
},
error: function (data) {
console.log(data);
}
});
}
Dev tools shows the request succeeded:
Request URL: https://localhost:5001/Index?handler=Stream?newStreamId=0
Request Method: GET
Status Code: 200
But the breakpoint was never hit and the property never updated.
public async Task OnGetStream(int newStreamId)
{
logger.LogInformation("Current stream on booking is {stream}", this.Booking.Stream.Id);
var stream = await context.Streams.FindAsync(newStreamId);
if (stream is null)
{
// Assume user is attempting to view all streams.
this.Booking.Stream = new Stream { Id = 0, Name = "All streams" };
}
else
{
this.Booking.Stream = stream;
}
logger.LogInformation("NEW stream on booking is {stream}", this.Booking.Stream.Id);
}
Additionally my calls to the logger aren't being written to the console but that's more of a minor issue.
Given the above code, is there something I've done wrong here? I feel like this is dead simple stuff but for whatever reason I can't seem to get it working.
Any assistance will be appreciated.
CodePudding user response:
url: "/Index?handler=Stream?newStreamId=" _streamId,
You have a ? instead of & separating your query string values. Try this instead:
url: "/Index?handler=Stream&newStreamId=" _streamId,