I'm actually stuck on this MVC application and can't find out the cause.
The code works fine in local Vis Studio 2013 Cassini webserver.
Hence when I type the URL in the browser: "/Customer/EnterCustomerDetails"
then I'm displayed a simple form, a DIV tag containing status message "Loading..." and after 5 seconds some data via EF is returned due to the $.get() script that gets executed.
However, when I publish the same code into IIS 7.5 running inside Windows 7 Ultimate, then all I see is the form and only the div tag that displays the message "Loading..." but no data is displayed and it seems the $.get() is not working in the full blown IIS and neither is $.post().
Where am I going wrong? Any help much appreciated. Thanks in advance.
"EnterCustomerDetails.cshtml"
#model P10LearnNewMVCWithEF.ViewModel.CustomerViewModel
#using P10LearnNewMVCWithEF.Models
#{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>EnterCustomerDetails</title>
#*BELOW Weve IMPORTED the 3 important JQuery LIBRARIES, since we want to use the $.get() AJAX method*#
<script src="~/Scripts/jquery-1.8.3.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
</head>
<body>
<div>
<form id="frm1">
Customer Code:- #Html.TextBoxFor(m => m.Customer.CustomerCode)
#Html.ValidationMessageFor(x => x.Customer.CustomerCode) <br />
Customer Name:- #Html.TextBoxFor(m => m.Customer.CustomerName)
#Html.ValidationMessageFor(x => x.Customer.CustomerName) <br />
<input type="button" value="Submit via true AJAX" id="btn1" onclick="SendData()" />
</form>
<div id="status"></div>
<table id="tbl">
<tr><th>Customer Code</th><th>Customer Name</th></tr>
</table>
<script type="text/javascript">
$("#status").text("Loading..."); //Add STATUS MESSAGE "Loading..." to DIV. Must use ".text" and NOT ".val"
//Making a CALL to the "GetCustomers" ACTION within the "Customer" CONTROLLER and Results returned will be in "BindData"
$.get("GetCustomers", null, BindData);
// The "GetCustomers" ACTION will return the JSON data into this JavaScript function
function BindData(customers) {
var tbl = $("#tbl");
for (var i = 0; i < customers.length; i++) {
var newRow = "<tr>" +
"<td>" + customers[i].CustomerCode + "</td>" +
"<td>" + customers[i].CustomerName + "</td>" +
"</tr>";
tbl.append(newRow);
}
$("#status").text(""); //REMOVING STATUS MESSAGE to EMPTY
}
function SendData() {
$("#status").text("Adding data via ajax..."); //Add STATUS MESSAGE "Loading..." to DIV. Must use ".text" and NOT ".val"
var frm = $("#frm1").serialize();
$.post("Submit", frm, BindData);
$("#Customer_CustomerCode").val("");
$("#Customer_CustomerName").val("");
}
</script>
</div>
</body>
</html>
"CustomerController.cs"
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading;
using System.Web;
using System.Web.Mvc;
using P10LearnNewMVCWithEF.DAL; //"CustomerDal" in here which derives from "DbContext"
using P10LearnNewMVCWithEF.Models; //"Customer" class in here
using P10LearnNewMVCWithEF.ViewModel;
namespace P10LearnNewMVCWithEF.Controllers
{
public class CustomerController : Controller
{
//Below is our NEW Simplified ACTION that will simply display our Enter Customer Details UI
public ActionResult EnterCustomerDetails()
{
CustomerViewModel objCustomerViewModel = new CustomerViewModel();
objCustomerViewModel.Customer = new Customer(); //This code by SHIV is pretty useless
//NOTE - WE'RE NOT RETRIEVING ANY DATA FROM DATABASE ANYMORE! as we'll do that with "GetCustomers()" ACTION
return View("EnterCustomerDetails", objCustomerViewModel);
}
public ActionResult Submit()
{
Customer obj = new Customer();
obj.CustomerCode = Request.Form["Customer.CustomerCode"]; //"name" is used on Server-side. "id" is used in Client-side.
obj.CustomerName = Request.Form["Customer.CustomerName"];
CustomerDal dal = new CustomerDal();
if (ModelState.IsValid)
{
//Let's INSERT the new Customer into DB via EF
dal.Customers.Add(obj);
dal.SaveChanges();
}
List<Customer> customersColl = dal.Customers.ToList<Customer>(); //Return all data from tCustomer via EF
return Json(customersColl, JsonRequestBehavior.AllowGet); //make sure you say customersColl AND NOT “customersColl”
}
//Below: "GetCustomers()" ACTION will be called by $.get() and simply returns a Collection of JSON data
public ActionResult GetCustomers()
{
CustomerDal dal = new CustomerDal();
List<Customer> customerscoll = dal.Customers.ToList<Customer>();
Thread.Sleep(5000);
return Json(customerscoll, JsonRequestBehavior.AllowGet);
}
}
}
Posting this as an answer so that you can mark it as answered.
That sounds like the identity in your IIS app pool is not authorized for database access. Either assign a new identity that has permission, or grant access to the identity you are using.
Related
I'm stuck with a CORS issue which works totally fine when I'm using Internet Explorer, but doesn't work with Google Chrome.
I have 2 separate projects in Visual Studio 2013: PROJECT 1 is on port 1044, it's just an empty project containing an HTML page with a Button which uses AngularJS to make a call to ACTION GetCustomer residing inside PROJECT 2 on port 1042. The ACTION then returns JSON data back to PROJECT 1.
The cross domain call works fine when the Button is clicked in IE and returns the data back to the HTML TextBox saying "ShivDataFromServer". But the same doesn't happen in Chrome.
PROJECT 1 on port 1044:
HomePage.html:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<script src="angular.min.js"></script>
<!--<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>-->
<body>
<script type="text/javascript" src="CustomerViewModel.js"></script>
<div ng-app>
<!-- Below is our VIEW i.e. Display-->
<div id="ViewCustomer" ng-controller="MyController">
Customer Name: <input type="text" id="txtCustomerName" ng-model="Customer.Name" /> <br />
Customer Amount: <input type="text" id="txtCustomerAmount" ng-model="Customer.Amount" /> <br />
<div style="width : 242px; height : 26px; background-color : {{CustomerView.Color}}"></div> <br />
<input type="button" id="btn1" value="Get data from Server" ng-click="GetData()" />
</div>
</div>
</body>
</html>
CustomerViewModel.js:
function MyController($scope, $http) {
$scope.Customer = { "Name": "ShivHardCodedData", "Amount": "1000" };
$scope.CustomerView = { "Color": "" };
//BELOW IS TRANSFORMATION LOGIC! Depending on Amount it will be GREEN or RED meaning "danger".
$scope.$watch("Customer.Amount", function() {
if ($scope.Customer.Amount < 1000) {
$scope.CustomerView.Color = "Green";
} else {
$scope.CustomerView.Color = "Red";
}
}
);
$scope.GetData = function () {
//BELOW WORKS!!
$http({ method: "GET", url: "http://localhost:1042/Customer/GetCustomer" })
.success(function (data, status, headers, config) { $scope.Customer = data; })
.error(function (data, status, headers, config) { });
} //END OF "GetData() function"
}
PROJECT 2 which is an MVC project on port 1042:
CustomerController.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using P10JsonJQuery_httpService.Models;
namespace P10JsonJQuery_httpService.Controllers
{
public class CustomerController : Controller
{
[ImAllowingCors]
public ActionResult GetCustomer()
{
Customer objCustomer=new Customer();
objCustomer.Name = "ShivDataFromServer";
objCustomer.Amount = 1000;
return Json(objCustomer, JsonRequestBehavior.AllowGet);
}
}
//CORS (Cross Origin Resource Sharing). I've made up name "ImAllowingCors" but ending "Attribute" is C# KEYWORD
public class ImAllowingCorsAttribute : ActionFilterAttribute
{
public override void OnActionExecuting(ActionExecutingContext filterContext)
{
//This means ALLOW any calls from a Cross-domain (i.e. allow calls from different server)
filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Origin", "*");
base.OnActionExecuting(filterContext);
}
}
}
ie does not count calls on different ports, but the same domain as being cross origin, whereas Chrome does. Thus, you need to set it up for chrome to allow this.
To do it the way you are trying, you will need to make sure the custom filter is registered and I think you will also need to change your attribute to [ImAllowingCorsAttribute]:
See: similar issue
You will need to allow Cors for your app. Something like the following annotation above the action:
[EnableCors(origins: "http://localhost:1042", headers: "*", methods: "*")]
Perhaps put a breakpoint in your attribute, as I doubt it is being hit. This should show you how to enable cors:
enabling Cors
I need to display the registration form and login form on the home page.
If validation fails on these two forms, I need to display proper errors on the home page.
But if there was no error, the user must be redirected to the secured Dashboard.
To accomplish this, I am using child action on the home page like this:
#Html.Action("Register", "Membership")
It work perfectly as expected if there are any errors, as it is able to re-render the partial view with the proper model that has validation state information.
But if there was no error, when it tries to redirect, it throws an error stating that:
Child actions are not allowed to perform redirect actions.
Is there any way around this? I am sure there is a way to put registration and login forms on the homepage. Most probably I don't know since I am quite new to ASP .Net MVC.
Could you point me in the right direction here?
One way to do this is to use ajax forms for the login and registration bits and, instead of returning a RedirectResult when the submission is valid, return some json which a bit of client-side script will watch out for and use to do a redirect for you.
Here's a simplified example.
Controller:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.ComponentModel.DataAnnotations;
using MvcApplication12.Models;
namespace MvcApplication12.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult Register()
{
return PartialView(new UserDetails());
}
[HttpPost]
public ActionResult Register(UserDetails details)
{
if (ModelState.IsValid)
{
return Json(new {redirect = true, url = Url.Action("Index","Dashboard")});
}
else
{
return PartialView(details);
}
}
}
}
Home page 'Index' view:
#{
ViewBag.Title = "Index";
}
<script src="#Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script type="text/javascript">
function checkForRedirect(data)
{
if (data.redirect && data.url)
{
location.href = data.url;
}
}
</script>
<p>Home page stuff.....</p>
<div id="RegistrationArea">
#Html.Action("Register")
</div>
<p> Home page stuff.....</p>
Registration form 'Register' partial view:
#model MvcApplication12.Models.UserDetails
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
#using (Ajax.BeginForm(new AjaxOptions()
{
HttpMethod = "POST",
Url = Url.Action("Register", "Home"),
OnSuccess = "checkForRedirect(data)",
UpdateTargetId = "RegistrationArea",
InsertionMode = InsertionMode.Replace
}))
{
#Html.LabelFor(m => m.UserName)
#Html.EditorFor(m => m.UserName)
#Html.ValidationMessageFor(m => m.UserName)
#Html.LabelFor(m => m.Password)
#Html.EditorFor(m => m.Password)
#Html.ValidationMessageFor(m => m.Password)
<input type="submit" />
}
You should not use the child actions in that context.
A solution to your problem could be to
place two forms in your page one for registration and one for login. The registration form posts to a Register action in a Membership controller, the login action posts to a Login action in the Membership controller.
In case an error occurs in one of the actions you can:
Show a dedicated Login/Registration page and use model/validation results to show error messages
Redirect to the URL/Action the user was coming from and show an error message you place in TempData
Without using javascript for redirect:
If you put forms inside your child views,Sometimes if you specify action name and controller name in Beginform helper(inside child view), this problem doesn't happen. for example I changed my child action view like this :
Before :
#using (Html.BeginForm())
{
...
}
After :
#using (Html.BeginForm("InsertComment", "Comments", FormMethod.Post, new { id = "commentform" }))
{
...
}
Now, You can put RedirectAction command inside "InsertComment" action and everything will work.
Two form in one page management:
1.Specify name for Submit button (Each form) (Ex: "submitvalue")
form1:
<input type="submit" value="login" name="submitValue" class="btn btn-success pull-right" />
form2:
<input type="submit" value="register" name="submitValue" class="btn btn-success pull-right" />
2.Make two action for these forms. (Ex: "Register" and "Login")
[HttpPost]
public ActionResult Login(LoginVM model, string submitValue)
{
if (submitValue == "login")
{
//Do Something
}
...
}
[HttpPost]
public ActionResult Register(RegisterVM model, string submitValue)
{
if (submitValue == "register")
{
//Do Something
}
...
}
If you click on register or login button in forms, both of actions are called but with "if" statement we determine whichone is our target.
I am using ASP.NET MVC 3.0 and getting the following error in *_Shared\Layout.cshtml*
Error executing child request for handler 'System.Web.Mvc.HttpHandlerUtil+ServerExecuteHttpHandlerAsyncWrapper'.
I get error at #{ Html.RenderAction("Menu", "Nav"); }
<!DOCTYPE html>
<html>
<head>
<title>#ViewBag.Title</title>
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
</head>
<body>
<div id = "header">
<div class = "title">SPORTS STORE</div>
</div>
<div id = "categories">
#{ Html.RenderAction("Menu", "Nav"); }
</div>
<div id = "content">
#RenderBody()
</div>
</body>
</html>
In Controllers\NavController:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using SportsStore.Domain.Abstract;
using SportsStore.WebUI.Models;
namespace SportsStore.WebUI.Controllers
{
public class NavController : Controller
{
private IProductRepository repository;
public NavController(IProductRepository repo)
{
repository = repo;
}
public PartialViewResult Menu()
{
IEnumerable<string> categories = repository.Products
.Select(x => x.Category)
.Distinct()
.OrderBy(x => x);
return PartialView(categories);
}
}
}
In Views\Nav\Menu.cshtml:
#model IEnumerable<string>
#
{
Layout = null;
}
#Html.ActionLink("Home", "List", "Product")
#foreach (var link in Model)
{
#Html.RouteLink(link, new
{
controller = "Product",
action = "List",
category = link,
page = 1
}
)
}
I could make the example to work.
There is a problem, however, with the code as it is posted. Note the line break in your exampe:
#
{
Layout = null;
}
While it should actually be
#{
Layout = null;
}
It generates the error you quoted "Error executing child request for handler 'System.Web.Mvc.HttpHandlerUtil+ServerExecuteHttpHandlerAsyncWrapper'", which is unhelpful, but when I pressed F5 I was taken to a page with a better description:
Parser Error Description: An error occurred during the parsing of a
resource required to service this request. Please review the following
specific parse error details and modify your source file
appropriately.
Parser Error Message: A space or line break was encountered after the
"#" character. Only valid identifiers, keywords, comments, "(" and
"{" are valid at the start of a code block and they must occur
immediately following "#" with no space in between.
Use the [ChildActionOnly] attribute on the Menu action like this:
[ChildActionOnly]
public PartialViewResult Menu()
{
IEnumerable<string> categories = repository.Products
.Select(x => x.Category)
.Distinct()
.OrderBy(x => x);
return PartialView(categories);
}
Here is the scenario. I want to use CKEditor for a rich text field on a form, but for whatever reason I cannot get the contents from the textarea to the server and back to the page without encoding problems. Here is the little sample program I wrote up to try and figure out what is going on. First, my view model:
HomeViewModel.cs
namespace CkEditorTest.Models
{
public class HomeViewModel
{
[Required]
[DataType(DataType.Html)]
[Display(Name = "Note")]
public string Note { get; set; }
}
}
Now my controller:
HomeController.cs
using System.Web.Mvc;
using CkEditorTest.Models;
namespace CkEditorTest.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View(new HomeViewModel());
}
[HttpPost]
[ValidateInput(false)]
public ActionResult Index(HomeViewModel model)
{
return View(model);
}
}
}
And finally, my view:
Index.cshtml
#model CkEditorTest.Models.HomeViewModel
#{
ViewBag.Title = "CKEditor Test";
}
#section head
{
<script type="text/javascript" src="#Url.Content("~/Scripts/ckeditor/ckeditor.js")"></script>
<script type="text/javascript" src="#Url.Content("~/Scripts/ckeditor/adapters/jquery.js")"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#Note").ckeditor();
});
</script>
}
<h2>CKEditor Test</h2>
#using (Html.BeginForm())
{
#Html.LabelFor(m => m.Note)<br /><br />
#Html.TextAreaFor(m => m.Note)<br />
<input type="submit" />
}
#if (!String.IsNullOrEmpty(Model.Note))
{
<div id="noteText">#Model.Note</div>
}
No matter what I do, I cannot display the Model.Note property as html on my view. By the time it reaches the view it is HTML encoded (i.e. <p> etc...). Here is what the form looks like pre-post:
pre-post http://www.matthewkimber.com/images/so/pre-post.png
And here is what the result is in the div below the "Submit" button:
post result http://www.matthewkimber.com/images/so/posted.png
I've set a breakpoint within Visual Studio and it shows as bare angle brackets (no encoding on HTML elements, just characters).
breakpoint results http://www.matthewkimber.com/images/so/dataInsideTheActionMethod.png
This, of course, is the stripped down test. I've tried encoding it, decoding it both in the view and in the controller to no avail.
By default everything is encoded when you use razor. I think you're looking for the Raw method.
It would also be a good idea to check the response using Fiddler or Firebug.
Try this:
#Html.DisplayTextFor(modelItem => item.Note)
You can also use HtmlString("")
<script src="../../Scripts/MicrosoftAjax.debug.js" type="text/javascript"></script>
<script type="text/javascript">
function loginOK()
{
var item = document.getElementById('statusLabel');
item.innerHTML = "OK";
document.getElementById('LoadImg').style.visibility = 'hidden';
}
function process()
{
var lab = document.getElementById('statusLabel');
lab.innerHTML = 'Checking...';
lab.style.color = 'Black';
document.getElementById('LoadImg').style.visibility = 'visible';
}
function fail()
{
var lab = document.getElementById('statusLabel');
lab.innerHTML = 'Login is being used';
lab.style.color = 'Red';
document.getElementById('LoadImg').style.visibility = 'hidden';
}
</script>
<div style="width:30%; float:left;">
<label for="Login">Login:</label>
<%= Html.TextBoxFor(model=>model.Login) %>
<%= Html.ValidationMessageFor(model=>model.Login) %>
<img id="LoadImg" alt="" src="../../Content/Images/ajax-loader.gif" style="visibility:hidden;"/>
<br />
<label id="statusLabel" />
<br />
<%=Ajax.ActionLink("CheckLogin","CheckLoginAvailability", "Account",
new AjaxOptions { UpdateTargetId = "statusLabel", OnBegin = "process", OnFailure = "fail", OnSuccess="loginOK"})%>
</div>
and, in the AccountController:
[AcceptVerbs(HttpVerbs.Post)]
public void CheckLoginAvailability(string login)
{
//do some job
}
And, FireBug says that /Account/CheckLoginAvailability is not found. Also, after callback that ActionLink is hidden. Why ?
You are talking about Ajax.BeginForm in your question but this is nowhere to be seen in the markup you provided. There are a couple of issues that I can see with your code:
Your action method doesn't return an ActionResult. Yeah I know, you will say that this is possible, right, but that's against any good practices, conventions and rendering your controllers unit-test friendly.
You are using Microsoft Ajax which will mix markup and javascript which IMHO is bad for multiple reasons: increasing bandwidth which of course leads to decreased performance, incapacity to externalize javascript into separate files in order to cache them by client browsers, having to write things like document.getElementById, innerHTML, style.color, style.visibility, etc... which is not guaranteed to work cross browser.
Here's what I would suggest you to improve this. While this doesn't answer your question, take it as an alternative approach.
As always the first thing to deal with is to define a model which in your case might look something like this:
public class LoginViewModel
{
public string Login { get; set; }
}
Of course you might wish to add other fields such as Password, but this is out of scope for the moment. The next step is to write a controller dealing with this model (in parallel you should be already setting a unit-test for the future controller to prepare the ground):
public class HomeController : Controller
{
public ActionResult Index()
{
// Simply return the Login form
return View(new LoginViewModel());
}
[HttpPost]
public ActionResult Index(LoginViewModel model)
{
// Deal with the actual authentication, etc...
throw new NotImplementedException();
}
[HttpPost]
public ActionResult CheckLoginAvailability(LoginViewModel model)
{
// TODO: query your datasource to determine whether
// model.Login is taken
// For this purpose we will suppose that it is taken
bool isLoginTaken = true;
// return a JSON object containing the result
return Json(new { IsLoginTaken = isLoginTaken });
}
}
The last part is to paint the screen:
<%# Page Language="C#" Inherits="System.Web.Mvc.ViewPage<SomeNs.Models.LoginViewModel>" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Login</title>
<!-- Use a separate CSS to avoid mixing markup with styling -->
<link rel="stylesheet" type="text/css" href="<%: Url.Content("~/content/site.css") %>" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<!-- Always use HTML helpers when dealing with Urls -->
<script type="text/javascript" src="<%: Url.Content("~/scripts/login.js") %>"></script>
</head>
<body>
<% using (Html.BeginForm()) { %>
<%: Html.LabelFor(x => x.Login) %>:
<%: Html.TextBoxFor(x => x.Login) %>
<%: Html.ValidationMessageFor(x => x.Login) %>
<br/>
<!-- Always use HTML helpers when dealing with Urls -->
<img id="loadImg" alt="" src="<%: Url.Content("~/content/images/ajax-loader.gif") %>" style="display:none;" />
<br />
<div id="statusLabel"></div>
<br />
<!-- Give this link an id so that we can easily identify it from javascript -->
<%: Html.ActionLink("CheckLogin", "CheckLoginAvailability", "Home", null, new { id = "checkLogin" })%>
<input type="submit" value="Login" />
<% } %>
</body>
</html>
And the last part is to unobtrusively attach our javascript (using jQuery of course) in the login.js file:
// When the DOM is ready
$(function () {
// Attach a click handler to the checkLogin link
$('a#checkLogin').click(function () {
// When this link is clicked send an AJAX POST request
// to the address this link is pointing to
$.ajax({
type: 'POST',
url: this.href,
// Pass as parameter in the POST body the login
// entered by the user
data: { login: $('#Login').val() },
beforeSend: function () {
// show the spinner image before sending any AJAX request
// to inform the user of an ongoing activity
$('#loadImg').show();
},
complete: function () {
// hide the spinner image when the AJAX request completes
// no matter if it succeeded or not
$('#loadImg').hide();
},
success: function (result) {
// if the AJAX request succeeds
// query the IsLoginTaken property
// of the resulting JSON object
if (result.IsLoginTaken) {
// Show the status label with red if the login is taken
$('#statusLabel').html('Login is being used').css('color', 'red');
} else {
// Show the status label in black if the login is not taken
$('#statusLabel').html('OK').css('color', 'black');
}
}
});
return false;
});
});
As #SLaks says actions can return void but, I think the action signature is such that it is required to return an action result and you can return EmptyResult if you don't want to return anything.
see this http://www.asp.net/mvc/tutorials/asp-net-mvc-controller-overview-cs
try changing your AccountController to
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult CheckLoginAvailability(string login)
{
//do some job
return new EmptyResult();
}