We Keep Coding

ajax pass a list of int to asp net api controller, parameter is null

I want to pass a list of int ids into my controller, but when the data hits the controller action, the parameter is null
[HttpGet]
public async Task<ActionResult> GetReport(int[] items)
{
var viewModel = await _reportLogic.GetReportByIdAsync(items);
// return something;
}
I have this code in my front end
$('#testPreviewList').click(function (e) {
var items = new Array();
$('.reportId').each(function () {
items.push(this.id);
});
console.log(items);
$.ajax({
url: "/home/GetReport",
type: "GET",
//contentType: "application/json; charset=utf-8",
data: { "items": items},
dataType: "json",
success: function (data) {
//do something
});
$("#datos").html(row);
$('#authorNameTextBox').val('');
},
error: function (result) {
//alert("Error");
}
});
});
What am I doing wrong?
thank you

Use POST instead of GET.
Use Traditional property in ajax, set to true.
$.ajax({
url: "/home/GetReport",
type: "POST",
//contentType: "application/json; charset=utf-8",
data: { "items": items},
dataType: "json",
Traditional: true,
success: function (data) {
//do something
});
$("#datos").html(row);
$('#authorNameTextBox').val('');
},
error: function (result) {
//alert("Error");
}
});

function is taking Null value by ajax in mvc5

This ajax is calling from .cshtml file to controller but getValue function is taking Null value on load, but afterwards it works fine. It evens shows the value on alert on ajax call, but getting null on controller. Any help would be highly appreciated.
<script>
$(document).ready(function(){
//get value from dropdown list
var ID = $('#cmb').val();
// ID is taking value
$.ajax({
// /ControllerName/FunctionName
// /Home/getvalue
url: "/Home/getValue",
type: "POST",
// ID is getting from dropdownList
// parameterName/value
data: JSON.stringify({'_ID':ID}),
dataType: "json",
traditional: true,
contentType: "application/json; charset=utf-8",
success: function (data) {
if (data.status == "success") {
//if got response
//alert(data.status);
}
},
error: function () {
//if if not response
//alert('something went wrong');
}
});
});
</script>
[HttpPost]
public JsonResult getValue(string _ID)
{
string a = _ID;
}

It is reasonable that you are taking null on the load, since the value of HTML element with id cmd would be undefined, since I assume that there isn't any value that is selected (option of a select element has an attribute called selected, when you have selected a value this attribute has the value true).
The strange thing is that you say that afterwards works as it is expected. I doubt this, except if you have any other code that you haven't include it in your post. As it seems there is only an AJAX call after the successfull load of the DOM.
Usually we register to an event, when we make an AJAX call like this. I could assume that you could register to the onChange event of the value of select element (dropdown)
$(document).ready(function(){
$("#cmb").on("change", function(){
//get value from dropdown list
var ID = $(this).val();
// ID is taking value
$.ajax({
// /ControllerName/FunctionName
// /Home/getvalue
url: "/Home/getValue",
type: "POST",
// ID is getting from dropdownList
// parameterName/value
data: JSON.stringify({'_ID':ID}),
dataType: "json",
traditional: true,
contentType: "application/json; charset=utf-8",
success: function (data) {
if (data.status == "success") {
//if got response
//alert(data.status);
}
},
error: function () {
//if if not response
//alert('something went wrong');
}
});
});
});

You have to change your URL and parameter check below code for that :
$(document).ready(function(){
//get value from dropdown list
var ID = $('#cmb').val();
// ID is taking value
$.ajax({
url: "/Home/getValue?_ID=" + ID,
type: "POST",
dataType: "json",
data: 'json',
success: function (data) {
if (data.status == "success") {
//if got response
//alert(data.status);
}
},
error: function () {
//if if not response
//alert('something went wrong');
}
});
});
Cheers !!

Change Paramaters Name
use id in replace of _ID
[HttpPost]
public JsonResult getValue(string id)
{
string a = id;
}
$(document).ready(function(){
$("#cmb").on("change", function(){
//get value from dropdown list
var id= $(this).val();
// ID is taking value
$.ajax({
// /ControllerName/FunctionName
// /Home/getvalue
url: "/Home/getValue",
type: "POST",
// ID is getting from dropdownList
// parameterName/value
data: JSON.stringify({'id':ID}),
dataType: "json",
traditional: true,
contentType: "application/json; charset=utf-8",
success: function (data) {
if (data.status == "success") {
//if got response
//alert(data.status);
}
},
error: function () {
//if if not response
//alert('something went wrong');
}
});
});
});

if you are sure that your ID is not null then just try this.
<script>
$(document).ready(function(){
var ID = $('#cmb').val();
$.ajax({
url: "/Home/getValue",
type: "POST",
data: {_ID:ID},
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function (data) {
if (data.status == "success") {
//if got response
//alert(data.status);
}
},
error: function () {
//if if not response
//alert('something went wrong');
}
});
});

Accessing PageMethod from aspx page

I have a webforms application and need to make an jquery ajax call to a PageMethod (i.e. WebMethod) in code behind from my aspx page. So far it does not work for me. Is this possible?
Here is my code:
$(function()
{
setInterval(function(){
$.ajax({
type: "GET",
url: "/ClientBillingBillDetails.aspx/MyPageMethod",
data: {someData: '<%= TheData %>'},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(result) {
}
});
}, 10000);
});
[System.Web.Services.WebMethod]
public static string MyPageMethod(int someData)
{
return "";
}
Is something wrong with my URL or something else?
Thanks

Try This:
$(function () {
setInterval(function () {
$.ajax({
type: "POST",
url: "/ClientBillingBillDetails.aspx/MyPageMethod",
data: "{ 'someData': '<%= TheData %>' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
}
});
}, 10000);
});

Use type as post and make sure if you have ajax.jquery library reference added in solution.
Also i think you can remove '/' in specifying method..
Just use "ClientBillingBillDetails.aspx/MyPageMethod".
Else you can use simple pageMethods using scriptmanager

.JQuery .ajax how do I call WCF method with return value?

I have been able to call WCF methods with .ajax. How do I call a method that returns a value? I need to call this method to see if data is ready and if not wait one second. The WCF method is:
[OperationContract]
[WebGet]
public bool IsDataReady(string requestGUID)
{
if (Global.publicDataDictionary.Keys.Contains(requestGUID))
return true;
else return false;
}
My JavaScript so far is:
$(document).ready(function() {
var input = {requestGUID:"<%=guid %>"};
console.log(input);
$.ajax({
url: "http://www.blah.com/services/TestsService.svc/IsDataReady",
type: "GET",
contentType: "application/json; charset=utf-8",
data: input,
dataType: "json",
success: function(data) {
}
});
EDIT2: I broke out the 2nd ajax call into a method but my logging is showing that the call to 2nd web service never passes a requestGUID. Can't i use the same input variable?
var guid = "<%= this.guid%>";
// var input = '{"SbiId":"' + guid + '"}';
// var input = {requestGUID:"ca222cf7-be5e-431a-ab93-9a31e8ae2f4a"};
function callUpdateGrid(input) {
console.log(input);
$.ajax({
url: "http://www.blah.com/services/TestsService.svc/GetContactsDataAndCountbyGUID",
type: "GET",
contentType: "application/json; charset=utf-8",
data: input,
dataType: "json",
success: function (data) {
var mtv = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
console.log(data);
mtv.set_dataSource(data.d.Data);
mtv.dataBind();
}
});
}
function CallIsDataReady(input) {
$.ajax({
url: "http://www.blah.com/services/TestsService.svc/IsDataReady",
type: "GET",
contentType: "application/json; charset=utf-8",
data: input,
dataType: "json",
success: function (data) {
if (!data) {
setTimeout(function (inputInner) { CallIsDataReady(inputInner); }, 1000);
}
else {
//Continue as data is ready
callUpdateGrid(input);
}
}
});
}
$(document).ready(function () {
var input = { requestGUID: "<%=guid %>" };
CallIsDataReady(input);
});
EDIT2: I broke out the 2nd ajax call into a method but my logging is showing that the call to 2nd web service is never getting called:
url: "http://www.blah.com/services/TestsService.svc/GetContactsDataAndCountbyGUID",
else {
//Continue as data is ready
callUpdateGrid(input);
}

The return value will be contained in the data parameter passed to the success callback setup in your ajax call.
You will need to check the value here, then if false, setup a timeout, which on expiry will attempt the ajax call again.
It would be best IMO to wrap up the Ajax call inside a function, that you can call in a recursive fashion when the timeout has expired. e.g.
function CallIsDataReady(input){
$.ajax({
url: "http://www.blah.com/services/TestsService.svc/IsDataReady",
type: "GET",
contentType: "application/json; charset=utf-8",
data: input,
dataType: "json",
success: function(data) {
if (!data){
setTimeout(function(){CallIsDataReady(input);}, 1000);
}
else{
//Continue as data is ready
}
}
});
}
$(document).ready(function() {
var input = {requestGUID:"<%=guid %>"};
console.log(input);
CallIsDataReady(input);
});

When you view source on this page is:
var input = {requestGUID:"<%=guid %>"};
showing correctly in the javascript? If you put a breakpoint in your IsDataReady method, do you see if requestGUID has a value? Is your service on the same domain as the page calling it?
EDIT:
In your service change: [WebGet]
to:
[WebGet(
RequestFormat=WebMessageFormat.Json,
ResponseFormat=WebMessageFormat.Json]
Read up on RESTful web services:
http://www.codeproject.com/Articles/105273/Create-RESTful-WCF-Service-API-Step-By-Step-Guide

Ajax Call in asp.net

I am making JQuery Ajax call in asp.net, I am returning String with my WebMethod, But on success of ajax call I am getting complete HTML of page in result.I also used type: "get" but no luck, below is my code for ajax call
$.ajax({
type: "POST",
url: "MyPage.aspx/GetData", //url to point your webmethod
success: function (Result) {
if (Result != "")
alert( Result);
},
error: function () { alert('error'); }
});
[System.Web.Services.WebMethod()]
public string GetData()
{
//getting value from Database and returning
}
I am calling this Ajax in MyPage.aspx

Try it like this. With the contentType: "application/json; charset=utf-8"
$.ajax({
type: "POST",
url: "MyPage.aspx/GetData", //url to point your webmethod
contentType: "application/json; charset=utf-8",
success: function (Result) {
if (Result != "")
alert( Result);
},
error: function () { alert('error'); }
});