通過使用jQuery

相同的功能有了asp.net的MVC我們可以做一個Ajax調用這樣更換Ajax.ActionLink通過使用jQuery

<a data-ajax="true" data-ajax-begin="fctTabLoading" data-ajax-complete="fctTabLoaded" data-ajax-mode="replace" data-ajax-update="#main-content" href="/MyController/MyAction/19">my link text</a>

現在我想要執行相同的Ajax調用，但從jQuery，我不知道如何繼續！

我想是這樣的：

    $.ajax({ 
         type: "Post", 
         url: myURL, 
         begin: fctTabLoading, 
         complete: fctTabLoaded, 
         mode: "replace", 
         update: "#main-content", 
         cache: false, 
         success: function() { alert('success'); } 
        });

我知道上面AJAX腳本將無法工作，因爲「模式」和「更新」無法識別。所以我被封鎖了。

這讓我發瘋:(

爲什麼我不能使用MVC ActionLink的呢？因爲我首先要表明一個jQuery對話框讓用戶確認，然後只做Ajax調用以刷新一個特定的div在我的網頁。

任何幫助是極大的讚賞。

感謝。

來源

2012-03-10 Bronzato

如你所知，在Ajax.ActionLink使用jquery.unobtrusive-ajax.js執行AJAX的聯繫。

如果您查看該文件，您將看到事件處理程序使用jQuery的實時事件綁定器。這將事件偵聽器綁定到文檔對象。所以，如果你想確認觸發此事件之前，你可以直接綁定到元素像下面這樣：

$('#YOUR_ELEMENT').click(function() { 
    var confirmed = confirm("CONFIRM_MESSAGE"); 
    if (!confirmed) { 
     return false; 
    } 
    return true; 
});

使用jQuery的對話框，你可以做到以下幾點：

function confirmDialog() { 
    $('#YOUR_DIALOG').dialog(
     { buttons: { "Ok": function() { return true; }, 
        { "Cancel": function() {return false;} 
     } 
    });

}

然後你會在之前的函數中設置confirmDialog（）。 ***對話框選項可能並不完全符合你的要求，但這應該會讓你走。

來源

2012-03-10 20:20:20

謝謝Brian。我不想使用確認JavaScript提供的難看的彈出窗口。我更喜歡使用jquery對話框。這就是爲什麼我需要從jQuery做我的ajax調用（我認爲）。任何可能的解決方案是可能的？ – Bronzato 2012-03-10 20:25:47

我從來沒有真正使用jQuery的對話框，所以我編輯的答案是基於查看文檔幾分鐘。 – 2012-03-10 20:48:36

不幸的是，使用自定義函數（用於調用jquery對話框）簡單替換確認javascript函數不起作用。我希望別人能幫助我。不管怎麼說，還是要謝謝你。 – Bronzato 2012-03-10 21:04:00

您也可以用普通鏈路更換您的Ajax鏈接開始：

@Html.ActionLink(
    "my link text",     // linkText 
    "MyAction",      // actionName 
    "MyController",     // controllerName 
    new { id = Model.RequestID },  // routeValues 
    new { id = "mylink" }    // htmlAttributes 
)

將產生以下標記：

<a href="/MyController/MyAction/12345" id="mylink">my link text</a>

，然後在一個單獨的js文件中悄悄地AJAXify它：

$(function() { 
    $('#mylink').click(function() { 
     $.ajax({ 
      url: this.href, 
      type: 'POST', 
      beforeSend: fctTabLoading, // corresponds to your OnBegin callback 
      complete: fctTabLoaded,  // corresponds to your OnComplete callback 
      success: function(result) { 
       $('#main-content').html(result); 
      } 
     }); 

     return false; 
    }); 
});

來源

2012-03-11 08:11:25

通過使用jQuery

回答

相關問題