We Keep Coding

MVC4 and jQuery/AJAX - Error not found when posting JSON

I am using Ajax (and jQuery UI) and when i press a button on the dialog i trigger the following action in the controller:
[HttpPost]
public JsonResult DeletePost(int adrId)
{
return Json("Hello World Json!", JsonRequestBehavior.DenyGet);
}
My JQuery Code looks like this:
<script type="text/javascript">
$(document).ready(function () {
$("#dialog").dialog(
{
buttons: {
"Ok": function () {
$.ajax({
url: '/Home/DeletePost',
type: 'POST',
data: { adrId: 6 },
dataType: 'json',
contentType: 'application/json; charset=utf-8',
error: function (xhr) {
alert('Error: ' + xhr.statusText);
},
success: function (result) {
CheckIfInvoiceFound(result);
},
async: true,
processData: false
});
$(this).dialog("close");
}
}
});
jQuery('.delete').click(function () {
})
})</script>
However, when i POST to the server, i get an "Error: Not Found"

The problem is with your data parameter not being a valid JSON payload.
It is not valid JSON, because jQuery is using the jQuery.param() method internally to prepare the request parameters for typical POST submissions, and it will get converted to the following string:
adrId=6
However, the server is expecting a JSON payload, and what you specified is clearly not a JSON payload. A valid JSON payload would be:
{ 'adrId': 6 }
One approach to send correct JSON in the data parameter is to refactor your jQuery AJAX to look like this:
$.ajax({
url: '/Home/DeletePost',
type: 'POST',
data: "{ 'adrId': 6 }",
dataType: 'json',
contentType: 'application/json; charset=utf-8',
error: function (xhr) {
alert('Error: ' + xhr.statusText);
},
success: function (result) {
alert("success");
},
async: true,
processData: false
});
Or you can use JSON.stringify as suggested by others.
An alternative approach would be to send your data as 'application/x-www-form-urlencoded; charset=UTF-8' which is the default, and that way you don't have to change your data parameter. The code would be much simplified:
$.ajax({
url: '/Home/DeletePost',
type: 'POST',
data: { adrId: 6 },
error: function (xhr) {
alert('Error: ' + xhr.statusText);
},
success: function (result) {
alert("success");
},
async: true
});
JQuery will recognize that the result is valid JSON.

Try this:
<script type="text/javascript">
$(document).ready(function () {
$("#dialog").dialog(
{
buttons: {
"Ok": function () {
$.ajax({
...
data: JSON.stringify({ adrId: 6 }),
...
});
$(this).dialog("close");
}
}
});
jQuery('.delete').click(function () {
})
})</script>

cannot get REST response using $.ajax()

Below is my method
function getCurrentUserName()
{
$.ajax({
type: "GET",
url: "http://localhost:8099/rest/prototype/1/space/ds",
crossDomain:true,
dataType: "jsonp",
success: function(resp){
alert("Server said123:\n '" + resp.name + "'");
},
error:function(e){
alert("Error"+e)
}
});
});
}
I am calling this on a button click , I do not see any alert , when i type the url on the browser I get the response in xml .but i do not get the response in the script.
Can someone please help me with this ? Am i missing something here ?
Thanks :)

Looks like a JSON parse error.
Try with the json instead of jsonp
function getCurrentUserName()
{
$.ajax({
type: "GET",
url: "http://localhost:8099/rest/prototype/1/space/ds",
crossDomain:true,
dataType: "json",
success: function(resp){
alert("Server said123:\n '" + resp.name + "'");
},
error:function(e){
alert("Error"+e)
}
});
});
}

Ajax Get Request with JQuery Error

I'm trying to call a php script with a get request and using the data theaddress however the results are showing me the source of the page im calling.
The page im calling is here
Here is my ajax function that will get this page
$( document ).ready(function() {
var address = document.getElementById("address");
$.ajax({
url: '/r10database/checkSystem/ManorWPG.php',
type: 'GET',
data: 'theaddress='+address.value,
cache: false,
success: function(output)
{
alert('success, server says '+output);
}, error: function()
{
alert('Something went wrong, saving system failed');
}
});
});

$( document ).ready(function() {
var address = document.getElementById("address");
$.ajax({
url: '/r10database/checkSystem/ManorWPG.php',
type: 'GET',
data: 'theaddress='+address.value,
cache: false,
success: function(output)
{
alert('success, server says '+output);
}, error: function(error)
{
alert (error); // this is the change from the question
}
});
});

Put the dataType as json with a curly brace
data: {theaddress:address.value},
dataType:'json',
success: function(output)
{
alert('success, server says '+output);
}, error: function(xhr)
{
alert (xhr.status);
}
and get the data in ManorWPG.php as $_GET['theaddress']
** share the xhr.status if failed.

Some Script Error , not able to find solution

I bounded data to dropdownlist but when i
click on button i want value of selected item but i cant get.and also its going refresh.
<script type="text/javascript">
$(document).ready(function () {
$.ajax({
type: "POST",
async: false,
contentType: "application/json; charset=utf-8",
data: "{}",
url: "Drpodownlistbindingjquery.aspx/getdata",
dataType: "json",
success: ajaxSucceess,
error: ajaxError
});
function ajaxSucceess(response){
$.each(response.d, function (key, value) {
$("#ddlCategory").append($("<option></option>").val(value.Sname).html(value.Sno));
});
}
function ajaxError(response){
alert(response.status + ' ' + response.statusText);
}
});
</script>
And ,my second problem is
<script type="text/javascript">
$(document).ready(function() {
$("#btnsubmit").click(function(){
$.ajax({
type: "get",
url: "loginform.aspx/getdataval",
data:'{"uname":"'+$("#TextBox1").val()+'","passwod":"'+$("#TextBox2").val()+'"}',
contentType: "application/json;charset=utf-8",
dataType: "json",
sucess:function(data){
var Emp=data.d;
alert('welcome');
$("#output").append('<p>'+Emp.Sname+ ' ' + Emp.Sno+'</p>');
//here i want to give redirect link
},
error: function(e) {
alert(e);
}
});
});
});
</script>
i m comparing username and password but its giving error. anything is wrong here?
Drpodownlistbindingjquery.aspx is not a typo mistake am sure.
Thanks in advance.

Second problem is easy:
sucess:function(data){
var Emp=data.d;
sucess should be success.
And as #nbrooks pointed out:
url: "Drpodownlistbindingjquery.aspx/getdata"
Drpodown should be Dropdown.

Just try this one:
data:{"uname":$("#TextBox1").val(),"password":$("#TextBox2").val()},

Load up javascript files after ajax call

Hi how do i go about loading up my javascript files after an ajax call has been made, reason being it seems once i click submit, some javascript functions do not end up working. I tried using "$getscript" however it was a bit buggy especially in google chrome? This is what my call looks like;
function InsertStatus() {
var fStatus1 = document.getElementById('<%=txtStatus.ClientID %>').value;
$.ajax({
type: "POST",
url: "WebServices/UserList.asmx/InsertUserStatus",
data: "{ 'fStatus': '" + fStatus1 + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
if (data.d == "Successful") {
$("#col-3").load(location.href + " #col-3>*", "");
$.getScript('scripts/script.js', function () {
});
}
else {
alert("its false");
$.getScript('scripts/script.js', function () {
});
}
}
});
};

Replace $.getScript('scripts/script.js', function () {});
With:
$.ajax({
dataType: 'script',
url: 'scripts/script.js',
crossDomain:true,
success: function(response)
{
//Whatever
}
});