admin管理员组文章数量:1313121
I am very new to web development and I've been searching around for a while now and I can't seem to find a solution to this. I am using razor pages in asp core 2.0 and I want to fill a drop down box based on another drop down box's selection. I set up the below javascript to hit a procedure in my razor page when the value of the first drop down box changes. When I run the code though, I can't get it to work. I think it is due to my return value but I can't seem to get that to be a json value as it keeps throwing an error at me when I try to. The error is that "JSON is not valid in this context". Can anyone suggest to me how to return JSON from razor pages to a javascript call?
Any help would be appreciated!
@section Scripts {
<script type="text/javascript">
$('#Department').change(function () {
var selectedDepartment = $("#Department").val();
var cardSelect = $('#Card');
cardSelect.empty();
if (selectedDepartment != null && selectedDepartment != '') {
$.getJSON('@Url.Action("GetCardsByDivisionAndStatus")', { divisionID: selectedDepartment }, function (cards) {
if (cards != null && !jQuery.isEmptyObject(cards)) {
cardSelect.append($('<option/>', {
Card_ID: null,
Card_Number: ""
}))
$.each(cards, function (index, card) {
cardSelect.append($('<option/>', {
Card_ID: card.Card_ID,
Card_Number: card.Card_Number
}));
});
};
});
}
});
</script>
}
And here is my C# code (I tried used JsonResult but that's not working either):
// If the user selects a division then make sure to get the cards for that division only
[HttpGet]
public ActionResult GetCardsByDivisionAndStatus(string divisionID)
{
int checkinStatus;
int intdivisionID;
if (divisionID != "0" && divisionID != null)
{
// Retrieve a status of checked in so that only cards with a checked in status can
// be checked out.
checkinStatus = linqQuery.GetCardStatusByStatusDesc("Checked In", _Context);
intdivisionID = Convert.ToInt32(divisionID);
// Retrieve list of cards that have the checkin status ID
CardList = linqQuery.GetCardListByStatusIDandDeptID(checkinStatus, intdivisionID, _Context);
// Create the drop down list to be used on the screen.
carddropdown = new List<CardDropDown>();
carddropdown = loaddropdowns.ReturnDropDownList(CardList);
return new JsonResult(CardList);
}
return null;
}
EDIT----------------------------------------------------------------------
So I changed the code as below and now I'm getting a parse error "JSON.parse: unexpected character at line 1 column 1 of the JSON data" I can't figure out what is going on as I can't see what the data is ing back that it can't parse. Is my code below not converting to JSON and if not, what am I missing?
@section Scripts {
<script type="text/javascript">
$('#Department').change(function () {
var selectedDepartment = $("#Department").val();
var cardSelect = $('#Card');
cardSelect.empty();
if (selectedDepartment != null && selectedDepartment != '') {
$.getJSON('@Url.Action("/CheckOutCard?handler=CardsByDivisionAndStatus")', { divisionID: selectedDepartment }, function (cards) {
if (cards != null && !jQuery.isEmptyObject(cards)) {
cardSelect.append($('<option/>', {
Card_ID: null,
Card_Number: ""
}))
$.each(cards, function (index, card) {
cardSelect.append($('<option/>', {
Card_ID: card.Card_ID,
Card_Number: card.Card_Number
}));
});
};
});
}
});
</script>
And here is my C# code for the procedure that I updated:
// If the user selects a division then make sure to get the cards for that division only
[HttpGet]
public JsonResult OnGetCardsByDivisionAndStatus(string divisionID)
{
int checkinStatus;
int intdivisionID;
if (divisionID != "0" && divisionID != null)
{
// Retrieve a status of checked in so that only cards with a checked in status can
// be checked out.
checkinStatus = linqQuery.GetCardStatusByStatusDesc("Checked In", _Context);
intdivisionID = Convert.ToInt32(divisionID);
// Retrieve list of cards that have the checkin status ID
CardList = linqQuery.GetCardListByStatusIDandDeptID(checkinStatus, intdivisionID, _Context);
// Create the drop down list to be used on the screen.
carddropdown = new List<CardDropDown>();
carddropdown = loaddropdowns.ReturnDropDownList(CardList);
var converted = JsonConvert.SerializeObject(carddropdown);
return new JsonResult(converted);
}
return null;
}
I am very new to web development and I've been searching around for a while now and I can't seem to find a solution to this. I am using razor pages in asp core 2.0 and I want to fill a drop down box based on another drop down box's selection. I set up the below javascript to hit a procedure in my razor page when the value of the first drop down box changes. When I run the code though, I can't get it to work. I think it is due to my return value but I can't seem to get that to be a json value as it keeps throwing an error at me when I try to. The error is that "JSON is not valid in this context". Can anyone suggest to me how to return JSON from razor pages to a javascript call?
Any help would be appreciated!
@section Scripts {
<script type="text/javascript">
$('#Department').change(function () {
var selectedDepartment = $("#Department").val();
var cardSelect = $('#Card');
cardSelect.empty();
if (selectedDepartment != null && selectedDepartment != '') {
$.getJSON('@Url.Action("GetCardsByDivisionAndStatus")', { divisionID: selectedDepartment }, function (cards) {
if (cards != null && !jQuery.isEmptyObject(cards)) {
cardSelect.append($('<option/>', {
Card_ID: null,
Card_Number: ""
}))
$.each(cards, function (index, card) {
cardSelect.append($('<option/>', {
Card_ID: card.Card_ID,
Card_Number: card.Card_Number
}));
});
};
});
}
});
</script>
}
And here is my C# code (I tried used JsonResult but that's not working either):
// If the user selects a division then make sure to get the cards for that division only
[HttpGet]
public ActionResult GetCardsByDivisionAndStatus(string divisionID)
{
int checkinStatus;
int intdivisionID;
if (divisionID != "0" && divisionID != null)
{
// Retrieve a status of checked in so that only cards with a checked in status can
// be checked out.
checkinStatus = linqQuery.GetCardStatusByStatusDesc("Checked In", _Context);
intdivisionID = Convert.ToInt32(divisionID);
// Retrieve list of cards that have the checkin status ID
CardList = linqQuery.GetCardListByStatusIDandDeptID(checkinStatus, intdivisionID, _Context);
// Create the drop down list to be used on the screen.
carddropdown = new List<CardDropDown>();
carddropdown = loaddropdowns.ReturnDropDownList(CardList);
return new JsonResult(CardList);
}
return null;
}
EDIT----------------------------------------------------------------------
So I changed the code as below and now I'm getting a parse error "JSON.parse: unexpected character at line 1 column 1 of the JSON data" I can't figure out what is going on as I can't see what the data is ing back that it can't parse. Is my code below not converting to JSON and if not, what am I missing?
@section Scripts {
<script type="text/javascript">
$('#Department').change(function () {
var selectedDepartment = $("#Department").val();
var cardSelect = $('#Card');
cardSelect.empty();
if (selectedDepartment != null && selectedDepartment != '') {
$.getJSON('@Url.Action("/CheckOutCard?handler=CardsByDivisionAndStatus")', { divisionID: selectedDepartment }, function (cards) {
if (cards != null && !jQuery.isEmptyObject(cards)) {
cardSelect.append($('<option/>', {
Card_ID: null,
Card_Number: ""
}))
$.each(cards, function (index, card) {
cardSelect.append($('<option/>', {
Card_ID: card.Card_ID,
Card_Number: card.Card_Number
}));
});
};
});
}
});
</script>
And here is my C# code for the procedure that I updated:
// If the user selects a division then make sure to get the cards for that division only
[HttpGet]
public JsonResult OnGetCardsByDivisionAndStatus(string divisionID)
{
int checkinStatus;
int intdivisionID;
if (divisionID != "0" && divisionID != null)
{
// Retrieve a status of checked in so that only cards with a checked in status can
// be checked out.
checkinStatus = linqQuery.GetCardStatusByStatusDesc("Checked In", _Context);
intdivisionID = Convert.ToInt32(divisionID);
// Retrieve list of cards that have the checkin status ID
CardList = linqQuery.GetCardListByStatusIDandDeptID(checkinStatus, intdivisionID, _Context);
// Create the drop down list to be used on the screen.
carddropdown = new List<CardDropDown>();
carddropdown = loaddropdowns.ReturnDropDownList(CardList);
var converted = JsonConvert.SerializeObject(carddropdown);
return new JsonResult(converted);
}
return null;
}
2 Answers
Reset to default 3Rename your method to OnGetCardsByDivisionAndStatus (note "OnGet" prefix) and in jquery code change the url to
$.getJSON('/{PageRoute}?handler=CardsByDivisionAndStatus'
e.g.
$.getJSON('/About?handler=CardsByDivisionAndStatus'
Notice the handler querystring parameter name will be your method name without OnGet prefix.
So I figured out what the problem was. Apparently I did not need to have the @URL.Action in my code. It was causing me to not hit my C# code which in return caused a null response back to my call. I have modified my javascript code to be as below to show what I am talking about. Thanks Mohsin for trying to help me out.
@section Scripts {
<script type="text/javascript">
$('#Department').change(function ()
{
var selectedDepartment = $("#Department").val();
var cardSelect = $('#Card');
cardSelect.empty();
if (selectedDepartment != null && selectedDepartment != '')
{
$.getJSON("/CheckOutCard?handler=CardsByDivisionAndStatus", { divisionID: selectedDepartment }, function (cards)
{
$.each(cards, function (index, card)
{
cardSelect.append($('<option/>',
{
value: card.card_ID,
text: card.card_Number
}));
});
});
}
});
</script> }
本文标签： cASPNet Razor PagesHow do you return json from a razor page to javascript getJsonStack Overflow
版权声明：本文标题：c# - ASP.Net Razor Pages - How do you return json from a razor page to javascript $.getJson? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741932569a2405661.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论