This may be a duplicate of any question but I was not able to find a solution to my problem.
I am building an MVC4 application in which I want to load JSON data from another JavaScript file, using AJAX.
For this, I tried using $.getJSON(), $.ajax(), $.get() other similar functions to load data. It is a simple AJAX call, nothing fancy! Eventually I realized that I need to make this call to a controller/action which would load the JSON and return it back. This solution worked for me.
$.ajax({
type: "GET",
url: "/controller/action", // <-- How can I refer to the JSON file directly here?
contentType: "application/json; charset=utf-8",
dataType: "application/json",
success: function(data) {
},
error: function(err) {
}
});
I want to know if there is some other way for me to load this file using JavaScript in the view itself without invoking any controller/action?
Note: The file is a .json file and not a .js file. I don't want to include the file in any <script> tag!
The problem here is that you don't have a mime type of type json specified in your web.config and IIS/IIS Express is returning a 404 error.
Try modifying your web.config like so:
<system.webServer>
<staticContent>
<mimeMap fileExtension=".json" mimeType="application/json" />
</staticContent>
</system.webServer>
You will also need to change the dataType to json instead of application/json:
$.ajax({
type: "GET",
url: "Content/your.json",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
},
error: function (err) {
}
});
Hope this helps.
To refer a JSON file, you can use the Url.Content() method in your Javascript :
$.ajax({
type: "GET",
url: "#Url.Content("~/Content/your.json")",
contentType: "application/json; charset=utf-8",
dataType: "application/json",
success: function (data) {
},
error: function (err) {
}
});
In this case, I have a your.json file in Content folder.
Hope it helps !
Related
I'm using Webform and Jqgrid to display master-detail information on same page.
Here is my Jqgrid definition:
Master JQGrid:
$("#MachineListGrid").jqGrid({
url: 'AdminHandler.ashx',
datatype: "json",
...
});
Detail JQGrid:
$("#MachineDetailListGrid").jqGrid({
url:'AdminHandler.ashx',
datatype: "json",
...
});
my question is, how does ashx file identify data to return json data back to the correct jqgrid?
I'd looked at the same between aspx and ashx from this tutorial but the tutorial only gave sample one JQGrid on page.
on the code, here is the way to capture the request:
System.Collections.Specialized.NameValueCollection forms = context.Request.Form;
The way that will solve the problem is to have two url - one for the master and another for the detail
$("#MachineListGrid").jqGrid({
url: 'AdminHandlerMaster.ashx',
datatype: "json",
...
});
$("#MachineDetailListGrid").jqGrid({
url:'AdminHandlerDatil.ashx',
datatype: "json",
...
});
If you can't do this you may identify it with additional parameter in the post data something like this
$("#MachineListGrid").jqGrid({
url: 'AdminHandler.ashx',
datatype: "json",
postData : { gridtype:"master"},
...
});
$("#MachineDetailListGrid").jqGrid({
url:'AdminHandler.ashx',
datatype: "json",
postData : { gridtype:"detail"},
...
});
In the response you will need to get the gridtype parameter to identify the master and detail data
$.ajax({
url: 'https://login.live.com/oauth20_authorize.srf?client_id=*********&scope=onedrive.readwrite&response_type=token&redirect_uri=http://localhost:54540/Home/Dashboard',
dataType: "json",
type: "GET",
contentType: 'application/json; charset=utf-8',
async: true,
processData: false,
cache: false,
success: function(data) {
alert(data);
},
error: function(xhr) {
alert('error');
}
});
I am getting the following Error
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:54540' is therefore not allowed access.
I know its about CORS but i cant find any simple solution.
It looks like you're trying to use ajax to get an auth token from the login server. Since this process may involve requiring the user of your app to log in or consent to giving your app access to their data, you need to navigate to that URL in the browser itself.
Here's more info about using oauth with OneDrive. You should also take a look at the javascript sample app and see how it works in practice.
I am trying to call a simple hellowworld function of ASP .NET WebService using JQuery AJAX call written in separate HTML file i.e. Not aspx file in ASP .NET.
Here is code of my AJAX call which works fine in aspx based web client.
$.ajax({
type: "POST",
url: "/Test1/RSSReader.asmx/GetRSSReader",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
$("#output").text(msg.d);
},
error: function (e) {
$("#output").html("WebSerivce error " + e.responseText);
}
});
I want to call same webservice and same method using .html file but it is returning error. I tried giving server address i.e. localhost but still no response.
When I am deploying my solution to my hoster a specific jquery element is just not showing up..
Its showing when i run it on my local pc.. but when deployed it just isnt there.. its a jquery element that renders a menu..
any ideas what could be causing this ?
I've uploaded all the references and everything..
jQuery.ajax({ type: "POST",
url: "/Bubble/MyInterests",
dataType: "json",
traditional: true,
success: function (data) {
$("#coInterestContainer").empty();
$("#coInterestTemplate").render(data).appendTo("#coInterestContainer");
$(document).on('click', '.coInterest', function () {
location.href="/Bubble/View/" + $(this).attr("id") + "?CreateOffer=1";
});
}
});
ascx.cs
protected string BindData()
{
List<Product> products = product.GetRepeaterData(prod);
string json = JsonConvert.SerializeObject(products);
return json;
}
ascx
<script type="text/javascript" language="javascript">
function doSomething() {
$.ajax({
type: "POST",
url: "/ProgramListSimple.aspx/BindData",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
alert(msg);
}
});
};
I am not able to see any alert ..I dont know if the ajax function is doing what it is suppose to do..this code is for user control & not on the aspx page does that matter? while debugging I am able to see the serialized data in json string. Its just that its not rendering on the client side....working on it since morning now I need some help please..any examples or any doc can also be useful..
You have to use the d property
alert(msg.d);
If you are using Chrome or Firefox to debug use the following to inspect a JavaScript object:
console.log("%o", msg);
In Chrome press Ctrl + Shift + J to show the developer console
I created a new aspx page. Transfered all the code behind logic to the aspx.cs from ascx.cs. The just called the url of the aspx page from my ascx page using ajax callback
type: "GET",
url:'<%=VirtualPathUtility.ToAbsolute("~/ProgramListSimpledetail.aspx") %>',
data: dataObject,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data)
I just added a small part of the fix that is very important for this to work other then this there were bunch of things that were added to make the ascx page inherit the properties from the apsx page.... but I think that was mainly related to my code...so I hope this helps someone in future...thanks for all those who tried to contribute..