将Json对象从控制器操作返回到jQuery [英] Returning Json object from controller action to jQuery
问题描述
我正在尝试让此工作正常（现在2天）。我在一个日志工作，我从jQuery调用控制器动作，传递一个JSON对象（使用json2.js）和从控制器返回一个Json对象。我可以调用操作罚款，但不是能够把响应放在我想要的地方，它只是打开一个新的窗口打印在屏幕上：
{Message：用户名/密码
组合无效}
URL看起来像 http：// localhost：13719 / Account / LogOn ，因此不是调用操作，而是重新加载将用户带到控制器的页面，这是不好的。
现在对于一些代码，首先是控制器代码
[HttpPost]
public ActionResult LogOn（LogOnModel model，string returnUrl =）
{
if（ModelState.IsValid）
{
var login = ObjectFactory.GetInstance< IRepository< PhotographerLogin> >（）;
var user = login.FindOne（x => x.Login == model.Username& x.Pwd == model.Password）;
if（user == null）
return Json（new FailedLoginViewModel {Message =Invalid username / password combination}）;
else
{
if（！string.IsNullOrEmpty（returnUrl））
return Redirect（returnUrl）;
else
return RedirectToAction（Index，Home）;
}
}
return RedirectToAction（Index，Home）;
}
和jQuery代码
$（＃signin_submit）。click（function（）{
var login = getLogin（）;
$ .ajax（{
类型：POST，
url：../Account/LogOn，
data：JSON.stringify（login），
dataType：'json'，
contentType： 'application / json; charset = utf-8'，
error：function（xhr）{
$（＃message）。text（xhr.statusText）;
}，
success：function（result）{
}
}）;
}）;
function getLogin（）{
var un = $（＃username）。val（）;
var pwd = $（＃password）。val（）;
var rememberMe = $（＃rememberme）。val（）;
return（un ==）？ null：{用户名：un，密码：pwd，RememberMe：rememberMe};
}
如果您需要在这里看到实际的登录表单， / p>
< fieldset id =signin_menu>
< div>
< span id =message>< / span>
< / div>
<％Html.EnableClientValidation（）; ％>
<％using（Html.BeginForm（LogOn，Account，FormMethod.Post，new {@id =signin}））
{％&
<％ViewContext.FormContext.ValidationSummaryId =valLogOnContainer; ％>
<％= Html.LabelFor（m => m.Username）％>
<％= Html.TextBoxFor（m => m.Username，new {@class =inputbox，@tabindex =4，@id =username}）％> = Html.ValidationMessageFor（m => m.Username，*）％>
< p>
<％= Html.LabelFor（m => m.Password）％>
<％= Html.PasswordFor（m => m.Password，new {@class =inputbox，@tabindex =5，@id =password}）％> = Html.ValidationMessageFor（m => m.Password，*）％>
< / p>
< p class =remember>
< input id =signin_submitvalue =登录tabindex =6type =submit/>
<％= Html.CheckBoxFor（m => m.RememberMe，new {@class =inputbox，@tabindex =7，@id =rememberme}）％&
<％= Html.LabelFor（m => m.RememberMe）％>
< p class =forgot> < a href =＃id =forgot_password_linktitle =点击此处重置密码。>忘记密码？< / a> < / p>
< p class =forgot-username> < a href =＃id =forgot_username_linktitle =Fogot您的登录名？我们可以帮助您>忘记用户名？< / a> < / p>
< / p>
<％= Html.ValidationSummaryJQuery（请修正以下错误。，新词典< string，object> {{id，valLogOnContainer}}）％>
<％}％>
< / fieldset>
登录表单加载到主页上
<％Html.RenderPartial（LogonControl）;％>
不知道这是否与此有任何关系，但以为我会提到。 p>
EDIT：登录表单加载类似于Twitter登录，点击链接，表单加载jQuery& CSS
想想什么@ user350374说我的动作签名JsonResult em> ActionResult 我做了一些修改，并修改了我的原始解决方案，以利用
我的行动改为
[HttpPost，MoveFormsScript]
public JsonResult LogOn（LogOnModel model， string returnUrl =）
{
if（ModelState.IsValid）
{
var login = ObjectFactory.GetInstance< IRepository< PhotographerLogin>
var user = login.FindOne（x => x.Login == model.Username& x.Pwd == model.Password）;
if（user == null）
return Json（new LoginResult {Success = false，Message =Invalid login}）;
else
{
return Json（new LoginResult
{
Success = true，
Message =Redirecting ...，
ReturnUrl =（！string.IsNullOrEmpty（returnUrl））？returnUrl：string.Format（Account / Index / {0}，user.Photographer.Key）
}）;
}
}
else
{
return Json（new LoginResultDTO {Success = false，Message =Incomplete fields}）;
}
}
p>
$（＃signin_submit）click（function（）{
var f = $（$ ）[0]）;
f.submit（function（）{
var loginData = f.serialize（）;
$ .post（f.attr函数（结果，状态）{
if（！result.Success）{
$（＃message）。text（result.Message）;
$ username）。focus（）;
$（＃username）。select（）;
}
else {
window.location.replace（result.ReturnUrl）;
}
}，json）;
return false;
}）;
}）;
LoginResult是一个简单的类，
public class LoginResult
{
public bool Success {get;组; }
public string Message {get;组; }
public string ReturnUrl {get;组; }
}
感谢tip @ user35037，现在我有两种方法未来。
I'm attempting to get this working properly (2 days now). I'm working on a log in where I'm calling the controller action from jQuery, passing it a JSON object (utilizing json2.js) and returning a Json object from the controller. I'm able to call the action fine, but instead of being able to put the response where I want it it just opens a new window with this printed on the screen:
{"Message":"Invalid username/password combination"}
And the URL looks like http://localhost:13719/Account/LogOn so instead of calling the action and not reloading the page it's taking the user to the controller, which isn't good.
So now for some code, first the controller code
[HttpPost]
public ActionResult LogOn(LogOnModel model, string returnUrl = "")
{
if (ModelState.IsValid)
{
var login = ObjectFactory.GetInstance<IRepository<PhotographerLogin>>();
var user = login.FindOne(x => x.Login == model.Username && x.Pwd == model.Password);
if (user == null)
return Json(new FailedLoginViewModel { Message = "Invalid username/password combination" });
else
{
if (!string.IsNullOrEmpty(returnUrl))
return Redirect(returnUrl);
else
return RedirectToAction("Index", "Home");
}
}
return RedirectToAction("Index", "Home");
}
And the jQuery code
$("#signin_submit").click(function () {
var login = getLogin();
$.ajax({
type: "POST",
url: "../Account/LogOn",
data: JSON.stringify(login),
dataType: 'json',
contentType: 'application/json; charset=utf-8',
error: function (xhr) {
$("#message").text(xhr.statusText);
},
success: function (result) {
}
});
});
function getLogin() {
var un = $("#username").val();
var pwd = $("#password").val();
var rememberMe = $("#rememberme").val();
return (un == "") ? null : { Username: un, Password: pwd, RememberMe: rememberMe };
}
In case you need to see the actual login form here that is as well
<fieldset id="signin_menu">
<div>
<span id="message"></span>
</div>
<% Html.EnableClientValidation(); %>
<% using (Html.BeginForm("LogOn", "Account", FormMethod.Post, new { @id = "signin" }))
{%>
<% ViewContext.FormContext.ValidationSummaryId = "valLogOnContainer"; %>
<%= Html.LabelFor(m => m.Username) %>
<%= Html.TextBoxFor(m => m.Username, new { @class = "inputbox", @tabindex = "4", @id = "username" })%><%= Html.ValidationMessageFor(m => m.Username, "*")%>
<p>
<%= Html.LabelFor(m=>m.Password) %>
<%= Html.PasswordFor(m => m.Password, new { @class = "inputbox", @tabindex = "5", @id = "password" })%><%= Html.ValidationMessageFor(m => m.Password, "*")%>
</p>
<p class="remember">
<input id="signin_submit" value="Sign in" tabindex="6" type="submit"/>
<%= Html.CheckBoxFor(m => m.RememberMe, new { @class = "inputbox", @tabindex = "7", @id = "rememberme" })%>
<%= Html.LabelFor(m => m.RememberMe) %>
<p class="forgot"> <a href="#" id="forgot_password_link" title="Click here to reset your password.">Forgot your password?</a> </p>
<p class="forgot-username"> <a href="#" id="forgot_username_link" title="Fogot your login name? We can help with that">Forgot your username?</a> </p>
</p>
<%= Html.ValidationSummaryJQuery("Please fix the following errors.", new Dictionary<string, object> { { "id", "valLogOnContainer" } })%>
<% } %>
</fieldset>
The login form is loaded on the main page with
<% Html.RenderPartial("LogonControl");%>
Not sure if that has any bearing on this or not but thought I'd mention it.
EDIT: The login form is loaded similar to the Twitter login, click a link and the form loads with the help of jQuery & CSS
Thinking about what @user350374 said about making the signature of my action JsonResult instead of ActionResult I did some tinkering and modified my original solution to utilize JsonResult and did all the checking/redirecting in jQuery instead of in the action.
My action changed to
[HttpPost,MoveFormsScript]
public JsonResult LogOn(LogOnModel model, string returnUrl = "")
{
if (ModelState.IsValid)
{
var login = ObjectFactory.GetInstance<IRepository<PhotographerLogin>>();
var user = login.FindOne(x => x.Login == model.Username && x.Pwd == model.Password);
if (user == null)
return Json(new LoginResult { Success = false, Message = "Invalid login" });
else
{
return Json(new LoginResult
{
Success = true,
Message = "Redirecting...",
ReturnUrl = (!string.IsNullOrEmpty(returnUrl)) ? returnUrl : string.Format("Account/Index/{0}", user.Photographer.Key)
});
}
}
else
{
return Json(new LoginResultDTO { Success = false, Message = "Incomplete fields" });
}
}
And my jQuery call to
$("#signin_submit").click(function () {
var f = $($("form")[0]);
f.submit(function () {
var loginData = f.serialize();
$.post(f.attr("action"), loginData, function (result, status) {
if (!result.Success) {
$("#message").text(result.Message);
$("#username").focus();
$("#username").select();
}
else {
window.location.replace(result.ReturnUrl);
}
}, "json");
return false;
});
});
LoginResult is a simple class just to hold the parts
public class LoginResult
{
public bool Success { get; set; }
public string Message { get; set; }
public string ReturnUrl { get; set; }
}
Thanks for the tip @user35037, now I have 2 ways to approach this in the future.
这篇关于将Json对象从控制器操作返回到jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
