將jQuery.get後的頁面重新加載到MVC控制器操作

我試圖創建一個MVC視圖，它將顯示一些表中的一些數據，然後通過點擊表上的提交按鈕來更新數據更新。在表更新的時候，表中的記錄可能會從一個表移動到另一個表（這全部在服務層而不是視圖中處理）。目前，我已從控制器呈現視圖，並且每個表都是將數據顯示給用戶的單獨局部視圖。我的更新被jQuery方法攔截，該方法捕獲表中的數據，然後將其作爲JSON字符串發佈到控制器。控制器然後反序列化JSON並將其發佈到服務層。將jQuery.get後的頁面重新加載到MVC控制器操作

然後我想要發生的是控制器返回一個視圖結果，刷新整個頁面，更新每個表，以便它顯示適當的記錄。我除了頁面刷新之外還有一切工作 - 我的控制器返回一個視圖結果，並且視圖和模型在返回點都是正確的，但是頁面並沒有像我期望的那樣刷新。

我想我失去了一些東西愚蠢的，但在一分鐘我還看不出來是什麼...

碼 -

在視圖

jQuery腳本：

function DailyPaymentIn(payInId, payOut, notes) { 
    this.PayInId = payInId; 
    this.PayOut = payOut; 
    this.Notes = notes; 
} 

$(function() { 
    $('#update-yes-payments').submit(function (e) { 
    e.preventDefault(); 

    var payments = new Array(); 

    $('#payment-table-yes tbody tr').each(function() { 
     var payInId = $('input#PayInId', this).val(); 
     var payOut = $('input#PayOut', this).is(':checked'); 
     var notes = $('input#payment_Notes', this).val(); 

     payments.push(new DailyPaymentIn(payInId, payOut, notes)); 
    }); 

    $.get('/payments/UpdatePayments', { json: JSON.stringify(payments) }); 
    }); 
});

以上是將值捕獲到一個對象中，然後將其序列化爲JSON。這是所有工作 - 數據發送到控制器方法，並在到達時處於正確的形狀。我已經在實驗中交換過帖子，沒有任何運氣。

控制器方法：

方法來呈現數據：

[HttpPost] 
public ViewResult PayInAdmin(PayInAdminModel model) 
{ 
    var payments = _autoPayOutService.PopulatePayments(model.PaymentsDate); 

    return View("AutoPayOut/PayInAdmin", payments); 
}

這是返回正確填充的圖。

方法來更新數據：

public ViewResult UpdatePayments(string json) 
{ 
    var updates = Deserialise<List<DailyPaymentInUpdateModel>>(json); 

    var model = _autoPayOutService.UpdatePayments(updates); 

    return View("AutoPayOut/PayInAdmin", model); 
}

這是接受JSON和正確處理它，但是當它返回時，該網頁不更新。請注意，返回的視圖在兩個控制器操作上都是相同的，並且服務調用的返回類型也是相同的 - 我可以看到在調試中返回了正確填充的模型。

我不確定問題是什麼，據我所知，這應該是正確返回視圖。我對jQuery和MVC 3相當陌生，所以很可能我會以錯誤的方式去解決它 - 我是否應該以不同的方式執行此操作，或者我是否錯過了某些內容，我不確定。

乾杯

來源

2012-02-09 Ian Cotterill

如果您需要更新整個頁面，則不需要使用ajax方法$.get。試試這個：

window.location = '/payments/UpdatePayments?json=' + JSON.stringify(payments);

來源

2012-02-09 21:20:11

這個工作，但產生一個可怕的網址。它正在做我所需要的。非常感謝。 – 2012-02-10 11:49:39

雖然這個工作，我仍然建議你稍微改變這種方法。如果您要「更新付款」，則應該執行** POST **而不是GET，然後它不會顯示在您的URL中。另外，請考慮[建議]（http://www.boutell.com/newfaq/misc/urllength.html）不要創建URL太長（超過2000個字符）。 – 2012-02-10 12:16:41

再次，如果您要更新整個頁面，請使用標準表單提交而不是$ .post函數。 – 2012-02-10 12:17:58

一旦從服務器接收數據，你實際上並不做任何與它。通過添加一個回調函數來更新您的$.get，該回調函數將結果粘貼到應該去的地方。

你可以閱讀更多關於jQuery的get功能in the jQuery documentation。

來源

2012-02-09 18:03:29 yoozer8

執行jQuery調用時，您沒有對成功或失敗採取任何操作。

獲取將通過AJAX執行，但頁面不會發生任何事情，返回的內容將被丟棄。

如果返回的內容是HTML，則可能需要在頁面上進行適當的替換。

編輯

要使用，你可以做以下的響應body標籤替換頁面的整個身體標記。在成功處理程序，你知道數據的反應將是一個HTML文檔，...

$.get(url, data, function(data, textStatus, jqXHR) { 
    $('body').replaceWith($('body', $(data))); 
});

這確實是蠻力，我不是100％確信它會工作，但你可以給它一個開槍，看看會發生什麼。

來源

2012-02-09 18:04:03

我過去就這麼做過，但因爲我想替換整個頁面的內容，而不僅僅是一個DIV，我希望這只是調用get會調用服務器動作和使其只顯示頁面。有沒有辦法讓它在整個頁面上顯示返回的數據，或者這樣做，我是否會試圖在執行過程中重新編寫JS函數來打破JS函數？ – 2012-02-10 12:00:25

如果你沒有修改頭部的任何東西，你應該沒問題。看到我上面的編輯。 – 2012-02-10 14:12:14

不幸的是 - 目前 - 腳本是在內聯。我想它可以重構到文件的某個位置並附加到母版頁上，但現在它是本體的一部分，所以現在不起作用。（還是）感謝你的建議。目前我正在尋找重構動作以返回JSON，然後從該JSON對象更新jQuery中的視圖。 – 2012-02-10 15:37:58

對不起，但問題是，你返回的頁面，但你沒有得到回報，獲得回報你需要使用回調..函數（數據）...看到下面的例子。然後，如果你做一個console.log在回調中可以看到返回。你需要做那樣的事情。

$.get('/payments/UpdatePayments', { json: JSON.stringify(payments) }, function(data){ 
    //The data is the return.. is the view 
    console.log(data); 
// you can change the div content 
$("#content").html(data) 
});

函數（Data）是get處理後的返回數據。

來源

2012-02-09 18:04:35 Lefsler

如果你不使用firefox + firebur或chrome，你可以做一個alert（數據），而不是console.log。 – Lefsler 2012-02-09 18:06:06

有什麼辦法可以改變整個頁面的內容嗎？ $（文件）。html的（數據）; ？ – 2012-02-10 11:50:20

$（「body」）。html（「新的html」） – Lefsler 2012-02-10 21:11:16

將jQuery.get後的頁面重新加載到MVC控制器操作

回答

相關問題