Calling server side function from client side not working - javascript

Here page1ClientSideFn() is a client side function of Page.aspx. In this function I want to call the server side method page2ServerSideFn() of another page Page2.aspx.cs. Is there any problem with the below client side code? It's not working. Should I modify the ajax
function page1ClientSideFn() {
$.ajax({
type: "POST",
url: "Page2.aspx.cs/page2ServerSideFn",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function () {
alert("success");
},
Error: function () {
alert("Error");
}
});
}

Your url looks wrong.It should not be page codebehind file.url: "Page2.aspx/page2ServerSideFn",
Also ensure page2ServerSideFn is public and static method.You can use chrome dev toolbar network tab to monitor your resquest you are sending.

Related

ASP.NET Core Razor Pages Download File from AJAX Post

Hello I am having issues downloading a file from an ASP.NET Core Razor page using an AJAX Post. What I want to do seems repetitively simple but has proved to be a real pain.
I do not want to store the file on the server but I am alright with TempData and a guid if needed.
I want to do a ajax post because I am sending data from the client to build the file.
Data sent to server will be encrypted into a string and that will be the contents of the file. (Note: Encryption is already working)
I want the file to download as my own extension *.dat.
Here is my asp.net core razor post method.
public IActionResult OnPostDownloadEncryptedFile([FromBody] List<FileData> fileData)
{
var response = ...THIS IS A REST WEB API CALL ASYNC I am calling .Result
var byteArray = Encoding.ASCII.GetBytes(response.EncryptedData);
var stream = new MemoryStream(byteArray);
return this.File(stream, System.Net.Mime.MediaTypeNames.Application.Octet, "myfile.dat");
}
Here is my Ajax post code:
$.ajax({
type: "POST",
url: "/MySite/MyPage?handler=DownloadEncryptedFile",
beforeSend: function (xhr) {
xhr.setRequestHeader("XSRF-TOKEN", $('input:hidden[name="__RequestVerificationToken"]').val());
},
data: JSON.stringify(myData),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
},
error: function (response) {
alert(response);
}
});
I realize that the ajax post is most likely incomplete and wrong not quite sure how to fix I have seen others using window.location but I am not sure how that works. Since when debugging I never have been able to get into the ajax post success function.
Any help would be greatly appreciated.
I got it working but I feel like its a terrible implementation.
Here is what I did:
public IActionResult OnPostEncryptFileData([FromBody] List<FileDataItem> fileData)
{
var response = this.restEndpoint.EncryptFileData(
new FileDataEncryptionRequest()
{
FileDataListItems = new FileDataList() { FileDataItems = fileData.ToList() }
}).Result;
return new JsonResult(response.EncryptedData);
}
public FileResult OnGetDownloadEncryptedFile(string data)
{
var byteArray = Encoding.ASCII.GetBytes(data);
return this.File(byteArray, "text/plain", "test.dat");
}
The Ajax post:
$.ajax({
type: "POST",
url: "/MySite/MyPage?handler=EncryptFileData",
beforeSend: function (xhr) { xhr.setRequestHeader("XSRF-TOKEN", $('input:hidden[name="__RequestVerificationToken"]').val()); },
data: JSON.stringify(fileData),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert(response);
window.location = "/MySite/MyPage?handler=DownloadEncryptedFile&data=" + response;
},
failure: function (response) {
alert(response);
}
});
Would love to hear some better solutions.

Call non static method in javascript from code behind in asp.net

I am having a non static method in aspx.cs file and want to call that method using javascript/jQuery.
I have seen many examples but none of them help i getting error like internal error 500 in javascript console.
here is the code
method in aspx.cs file
public void methodname()
{
// populating repeater
rp.DataSource = datatable;
rp.DataBind();
}
and in aspx file
function updateRepeater() {
console.log("update called");
$.ajax({
type: 'POST',
url: "aspx/methodname",
data: '{}',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
async: true,
cache: false,
success: function (result) {
console.log("Success");
},
error: function (msg) {
console.log("Error");
}
});
}
but its not working i have also tried web method but it work with only static methods so can't use that.
can anyone tell me how to do this or i m doing anything wrong.
the error i get in console is
jquery-3.5.1.min.js:2
POST http://localhost:1003/foldername1/foldername2/PageNAme.aspx/MethodName 500 (Internal Server Error)

Jquery ajax not calling server side function

I have solution structure as:
I want to call recommendationProcess function from CTL_RateRecommendationDetails.ascx.cs from
CTL_RateRecommendationDetails.ascx
So i written code as:
$.ajax({
type: "POST",
url: "/UserControls/CTL_RateRecommendationDetails.ascx/recommendationProcess",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(value) {
alert(value.d);
},
error: function(e) {
alert("Ajax Error" + JSON.stringify(e));
}
});
But every time it comes in error block.
I have tried with :
url: "/CTL_RateRecommendationDetails.ascx/recommendationProcess",
And
url: "CTL_RateRecommendationDetails.ascx/recommendationProcess",
But its not calling function.
[System.Web.Services.WebMethod]
public static void recommendationProcess()
{
}
You can't call code behinds of user controls from JQuery Ajax
Ref : http://forums.asp.net/t/1423555.aspx
Using jQuery AJAX to call ASP.NET function in control code-behind instead of page code-behind
how-to-access-server-side-method-in-ascx-control-using-jquery-ajax-method

Getting grunt's connect server to accept POST requests on static files

I'm trying to use the connect middleware framework grunt comes preconfigured with to develop the front-end of my application, with static JSON files standing in for actual web services which I'll develop later.
However, sending a POST request to my static file results in a 404 error, even though a GET request with the same URL and parameters works just fine.
Can I configure grunt/connect to simply serve up my static file when a POST request is made to that URL?
I did a trick in my source code to call GET method if the app uses Grunt Server:
var useGruntServer = window.location.href.indexOf("localhost:9000") >= 0;
self.jsonGet = function (url, dataIn, callback, errorCallBack) {
$.ajax({
data: dataIn,
type: "GET",
url: url,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
if (callback) callback(result);
},
error: function () {
if (errorCallBack) errorCallBack();
}
});
};
self.jsonPost = function (url, dataIn, callback, errorCallBack) {
//Grunt Server Accepts only GET requests
if (useGruntServer) {
self.jsonGet(url, null, callback, errorCallBack);
return;
}
$.ajax({
data: self.objectToJsonString(dataIn),
type: "POST",
url: url,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
if (callback) callback(result);
},
error: function () {
if (errorCallBack) errorCallBack();
}
});
};

unable to get json response coming from REST web service in html using jQuery

I have a JSON response coming from REST web service and want to bind that data to html using jQuery. Looks like its not even hitting web service url which I have provided in my jquery.
Url is working fine which gives me JSON data in browser but jQuery I am using unable to get any content from this. I am pasting my code here, plz let me know if some one can help.
While debugging script its directly going on error section in ajax call.
<script type="text/javascript">
$(document).ready(function () {
GetData();
});
function GetData() {
// alert(textblock.value);
$.ajax({
type: "GET",
url: "http://localhost:8092/api/Employees",
data: "{'employeeId'= '" + 1234 + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
var results = $.parseJSON(msg.d);
alert(msg);
alert(results);
},
error: function (result) {
alert('here');
var tt = result.text;
alert(tt);
}
});
}
</script>
finally i am able to get data now.
I added below properties in $.ajax:
processData: false,
async: false,

Categories