MVC利用ajax验证登陆问题

[pgyangel]

MVC在控制器中可以用ModelState.AddModelError("", "提供的用户名或密码不正确。");这种方式赋值错误提示，前端用@Html.ValidationSummary()方法显示。但是这有个问题，@Html.ValidationSummary()方法最终显示是带ul标签显示。
如果页面排版不适合在页面新增内容，而是用alert弹窗来显示错误信息更合适。这要怎么弄？现在不知道思路如何走。我只知道是用js里的ajax来实现。但是遇到很多奇怪问题：
Controllers代码：

public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public ActionResult Index(Operation.Model.userInfo ui)
        {
            if (ModelState.IsValid)
            {
                try
                {
                    Operation.BLL.userInfo uiBLL = new Operation.BLL.userInfo();
                    ui.pwd = System.Web.Security.FormsAuthentication.HashPasswordForStoringInConfigFile(ui.pwd, "MD5").ToUpper();
                    if (uiBLL.Exists(ui))
                    {
                        return RedirectToAction("Index", "UserInfo");
                    }
                    else
                    {
                        return Content("用户名密码错误！");
                    }
                }
                catch
                {
                    return View();
                }
            }
            else
            {
                return View();
            }
        }

JS代码：

$(document).ready(function () {
    /*登陆按钮*/
    $('#loginBtn').click(function () {
        $.ajax({
            url: '/Login/Index',
            data: 'string',
            type: 'post',
            success: function (data) {
                alert(data);
            }
        });
    });
    /**登陆按钮 END**/
});

View代码：

@model Operation.Model.userInfo

@using (Html.BeginForm("LoginAction", "Login", null, FormMethod.Post, new { id = "myform", name = "myform" }))
{
    <table cellpadding="0" cellspacing="0" border="0">
        <tr>
            <td colspan="2">
                @Html.AntiForgeryToken()
                @Html.ValidationSummary(true)
            </td>
        </tr>
        <tr>
            <td>
                用户名：
            </td>
            <td>
                @Html.TextBoxFor(model => model.userName)
            </td>
        </tr>
        <tr>
            <td>
                <pre>密　码：</pre>
            </td>
            <td>
                @Html.PasswordFor(model => model.pwd)
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input type="image" src="~/Images/loginBtn.gif" id="loginBtn"/>
            </td>
        </tr>
    </table>
}

我的控制器Index方法在else中要如何返回字符串或者json让JS的点击事件可以成功读取到信息，这个JS代码读取的Index是一开始return View那个方法，弹出来的是页面源码，另外写一个方法输出striing或者json是可以成功接收并弹出的，但是登陆按钮是button，不是submit。求大神给点思路。
我想的思路应该是按钮先submit表单内容给后台，然后后台进行判断用户名密码是否正确，不通过返回一个错误字符串或json格式数据给前端，前端用ajax接收数据利用alert弹出错误提示。

如果说只是单纯获取JsonResult方法或者string方法那很简单，不需要提交表单，但是这个登陆验证肯定是要先提交表单，在后台验证后再获取验证信息然后进行页面跳转或提示错误。这个就没有头绪了，求大神支招

[devmiao]

http://www.2cto.com/kf/201212/172739.html

[pgyangel]

引用

你既然是form表单提交，为什么不使用submit呢 还有如果你使用按钮提交，那就要把你需要的参数全部提交到后台，进行判断后，再用json把验证后的提示消息返回到前台，弹出消息应该没什么问题

input里面image按钮默认就是有submit提交表单的功能。
现在问题是我在控制器else代码改成return Json("用户名密码错误");但是页面出现的是下面这种情况


我的js代码根本不走click事件。

[pgyangel]

上面的效果是直接返回了字符串，把原有页面完全替代了，url地址并没有改变。因为方法是ActionResult类型。

[pgyangel]

引用 1 楼 devmiao 的回复:

http://www.2cto.com/kf/201212/172739.html

这个js修改后读取的信息是@Html.ValidationSummary()里面的信息？ 这个js没有接触过，我只会jquery和原生的js

[wangweimutou]

你既然是form表单提交，为什么不使用submit呢 还有如果你使用按钮提交，那就要把你需要的参数全部提交到后台，进行判断后，再用json把验证后的提示消息返回到前台，弹出消息应该没什么问题