Javascript POST和按鈕提交

所以，這是我今天注意到的奇怪行爲。Javascript POST和按鈕提交

我有一個從SurfaceController繼承的控制器。

我有一個[發佈]操作方法，返回到相同的局部視圖，這很好。原因是由於該頁面上發生的分頁/過濾。

現在，在視圖本身，如果我使用按鈕提交，我看到所有提交的東西都很好。但是，如果我使用帶有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>

< 剪斷>

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

ASC

現在，如果我不使用提交按鈕，而只是在JS函數中的form.submit（）中使用超鏈接和註釋 - 它會發布帖子，但模型值爲null/default，然後它回憶起自己的價值再次被填充。

想法？！

來源

2014-08-29 Ahmed ilyas

頁面上是否存在JavaScript錯誤？ – 2014-08-29 19:59:34

無............ – 2014-08-30 05:39:22

當您單擊提交按鈕時，頁面將在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中有腳本代碼，所以我將js代碼中的click事件與jQuery綁定在一起。在此處測試：http://jsfiddle.net/03gj1r02/2/

來源

2014-08-30 10:41:12

謝謝。但在onclick中使用腳本代碼永遠不會「壞」 - 您提供的代碼與JQuery不同，除了JQuery，但將事件附加到指定的控件...與onclick函數相同的事情 – 2014-08-30 17:28:49

@Ahmedilyas是的我知道它做同樣的事情，但它不是很好的做法，在onclick綁定你的js的東西。在此處查看更多內容：http://en.wikipedia.org/wiki/Unobtrusive_JavaScript和http://stackoverflow.com/questions/12627443/jquery-click-vs-onclick – 2014-08-30 20:14:31

Javascript POST和按鈕提交

回答

相關問題