Question

所以，这是我今天注意到的一种奇怪的行为。

我有一个继承自SurfaceController的控制器。

我有一个[Post] Action方法，它返回到同一个局部视图，这很好。原因是该页面上发生的分页/过滤。

现在，在视图本身上，如果我使用按钮提交，我会看到提交的所有内容都很正常。

但是，如果我使用带有onclick事件的超链接来设置隐藏字段值然后执行form.submit（），那么最初模型的值为null但是然后它会重新执行提交所有的价值再次到位！

这没有意义。按钮提交和执行form.submit（）的javascript函数有什么区别？

真的没有太多代码：

//控制器

[HttpPost]
public PartialViewResult FilterResultsForTransaction(MyModel model)
{
.....
}

//查看

<script language="javascript">    
function ApplySort(fieldname, sortDir)
{
   $('#Filter_FieldName').val(fieldname);    
   $('#Filter_SortDir').val(sortDir);
   //var form = $('#form');
   //form.submit();
}
</script>

＆LT;的剪断＆GT;

<input type="submit" onclick="javascript:ApplySort('OrderDate'........)" value="ASC" />

ASC

现在，如果我不使用提交按钮，只是在JS函数中的form.submit（）中使用超链接和注释 - 它会发布帖子，但模型值为null / default然后它会回忆本身的值再次填充。

想法？！

Answer 1

当您单击提交按钮时，页面将在ApplySort（）中的脚本完成之前提交其数据。因此，您必须停止提交，然后设置隐藏的字段值，然后提交表单。像这样：

<input type="submit" data-field="bla" data-sort="ASC" value="Sort ASC" />


<script>    
    $("input").on("click", ApplySort)

    function ApplySort(e)
    {
        e.preventDefault(); //stop postback
        var btn = $(this);
        var form = $('#form');

        $('#Filter_FieldName').val(btn.attr("data-field"));
        $('#Filter_SortDir').val(btn.attr("data-sort"));

        console.log("submit")
        form.submit();
    }
</script>

在onclick中使用脚本代码通常很糟糕，因此我使用jQuery将js代码中的click事件绑定。在这里测试一下：http://jsfiddle.net/03gj1r02/2/

Javascript POST和按钮提交

1 个答案: