Jquery表单帖子问题

时间:2011-07-20 21:37:54

标签: asp.net-mvc ajax jquery

我正在使用asp.net MVC,我在使用jquery发布表单时遇到问题。 它没有发布到我告诉它的网址。 如果我使用firebug,它会显示发生的帖子,但每次都会发布到控制器的索引。我无法弄清楚为什么。我已经验证了我想要发布的动作的网址,但我无法弄清楚为什么它总是发布到控制器的索引....注意:找到表单的视图是索引视图。所以基本上它是张贴到它自己的行动,而不是我告诉它的网址中的那个。任何帮助都会很棒。谢谢!

这是我的表格

 <form  action='' id="descriptionForm">
<%=Html.Hidden("claimNumber", ViewData["claimNumber"])%>
<%=Html.Hidden("partNumber", ViewData["partNumber"])%>
<%=Html.Hidden("qty", ViewData["qty"])%>
<table>
    <tr>
        <td style="text-align: right">
            Category:
        </td>
        <td>
            <%=Html.DropDownList("problemCategory", (IEnumerable<SelectListItem>)ViewData["problemSelect"], "-Select-")%>
        </td>
    </tr>
    <tr>
        <td style="text-align: right">
            Details:
        </td>
        <td>
            <select id="problemDetails">
            </select>
        </td>
    </tr>
    <tr>
        <td style="text-align: right">
            Dealer Notes:
        </td>
        <td>
            <%=Html.TextArea("dealerNotes", "", 3, 40, null)%>
        </td>
    </tr>
</table>
<div style="position: absolute; bottom: 8px; right: 8px">
    <input type="button" id="itemDetailsCancel" value="Cancel" />
    <input type="submit" id="itemDetailsSubmit" value="Save" />
</div>
</form>
 <a href='<%=ResolveUrl("~/Warranty/WarrantyClaims/CompleteAddLineItemToClaim/") %>'
id="CompleteLineItemUrl"></a>

这是我的Javascript

   $("#descriptionForm").submit(function () {
    var completeurl = $("#CompleteLineItemUrl").attr('href');
    var data = $(this).serialize();

    $.post({
        type:'POST',
        url: completeurl,
        data: data,
        success: function (result) {
            alert("done");
        }
    });
    return false
});

这里的好处是我试图发布的控制器动作(虽然它没有做太多)

  [HttpPost]
    public ActionResult CompleteAddLineItemToClaim(string claimNumber, string partNumber, string qty, string problemCategory, string problemDetails, string dealerNotes)
    {
        var result = new { result = "done" };

        return Json(result, JsonRequestBehavior.AllowGet);
    }

更新: 更新的javascript

$(function(){

        $('#descriptionForm').submit(function () {
            var completeurl = $('#CompleteLineItemUrl').attr('href');
            var data = $(this).serialize();

            $.ajax({
                type: 'POST',
                url: completeurl,
                data: data,
                success: function (result) {
                    alert('done');
                }
            });
            return false;
        });

 });

2 个答案:

答案 0 :(得分:2)

确保在订阅任何活动之前已将您的javascript包装在document.ready中。在方法结束时返回false时,您也会丢失;

但您真正的问题是,您希望使用$.ajax代替$.post。因此,实际发生的是由于错误地使用$.post函数而导致javascript错误,而.submit处理程序从未有时间return false并取消默认提交表单和浏览器愉快地进入POST到表单的动作(这是空的,默认为呈现此表单的动作)。

总结一下:

$(function() {
    $('#descriptionForm').submit(function () {
        var completeurl = $('#CompleteLineItemUrl').attr('href');
        var data = $(this).serialize();

        $.ajax({
            type: 'POST',
            url: completeurl,
            data: data,
            success: function (result) {
                alert('done');
            }
        });
        return false;
    });
});

或者如果您想使用$.post

$(function() {
    $('#descriptionForm').submit(function () {
        var completeurl = $('#CompleteLineItemUrl').attr('href');
        var data = $(this).serialize();

        $.post(completeurl, data, function (result) {
            alert('done');
        });
        return false;
    });
});

而不是以经典的WebForms方式生成链接:

<a href='<%=ResolveUrl("~/Warranty/WarrantyClaims/CompleteAddLineItemToClaim/") %>' id="CompleteLineItemUrl"></a>

在ASP.NET MVC中,您使用HTML帮助程序以确保链接URL符合您的路由:

<%= Html.ActionLink(
    "Link text", 
    "CompleteAddLineItemToClaim", 
    "WarrantyClaims", 
    new { area = "Warranty" },
    new { id = "CompleteLineItemUrl" }
) %>

答案 1 :(得分:2)

表单本身是否由ajax调用加载?

如果需要,你需要使用jquery的live()函数。