在沒有FormMethod.Post的Dropdownlist中獲取SelectedItem

我有一個綁定到我的模型中的列表的下拉列表。 Model.list_IDs在沒有FormMethod.Post的Dropdownlist中獲取SelectedItem

當前頁面是一個「編輯」頁面，用戶可以使用下拉列表固有地更改模型的屬性。

@Html.DropDownListFor(model => Model.ID, Model.list_IDs, new { style = "width:250px" })

的下拉列表中的項目是不直觀的，所以我想提供一個按鈕，該按鈕時，（通過稱爲GetDetails的方法從控制器調用）

檢索經由存儲過程的其他信息

這個按鈕是通過一個動作鏈接創建的，我打算顯示一個局部視圖（就像一個聚焦的彈出窗口），一旦點擊按鈕就會顯示附加信息。

@Html.ActionLink(" ", "GetDetails", new { id = Model.ID.ToString() }, new { @class = "lnkMagnify16", title = "View Details" })

顯然Model.ID.ToString()是不正確的，因爲它只會發送模式的電流ID，而不是目前在下拉列表中選擇的ID。

如何更改Model.ID.ToString()以表示下拉列表的當前選定項目？

我知道有一種方法可以使用FormMethod.Post（Get selected item in DropDownList ASP.NET MVC）來做到這一點，但我不想用提交按鈕重新加載頁面。如果可能，我還想避免使用JavaScript等「第三方」方法。

來源

2017-05-03 blacksaibot

JavaScript不是「第三方」的方法，它也是只有方式來完成你想要的東西。無論是通過標準表單發佈還是通過AJAX（JavaScript），您的都必須向服務器發出新請求以獲取所需的新信息。

現在，由於您只是在動態更新鏈接中的Model.ID值，所以您可以在沒有AJAX或表單發佈的情況下執行此操作，但您仍然必須使用JavaScript，因爲所有動態行爲客戶端-side來自JavaScript。基本上，您需要綁定到下拉列表的更改事件，並更改鏈接的屬性href。

document.getElementById('ID').addEventListener('change', function() { 
    var selectedId = this.options[this.selectedIndex].value; 
    document.getElementById('AwesomeLink').href = // alter `href` with `selectedId` 
});

但是，如果用戶點擊該鏈接，該鏈接仍然會改變整個視圖。如果你真的希望用戶留在頁面上，那麼你需要使用AJAX獲取該鏈接的響應，然後以某種方式將其添加到頁面，無論是直接還是通過模式彈出窗口（這將需要甚至可以實現更多的JavaScript）。另外，還不清楚Model.ID值是如何在URL中結束的，即它是路徑的一部分（/some/url/{id}/）還是作爲查詢字符串參數（/some/url/?id={id}）。如果它是前者，我建議切換到後者，因爲這會使構建URL客戶端變得更容易。

var xhr = new XMLHttpRequest(); 
xhr.addEventListener("load", function (response) { 
    // add response.responseText to the DOM 
}); 
xhr.open("GET", "/some/url/?id=" + selectedId); 
xhr.send();

來源

2017-05-03 13:26:09

感謝您的詳細回覆。但是，我沒有試圖動態更新Model.ID值。可以這樣想：作爲用戶，您希望在下拉列表中看到您當前選擇的ID的詳細信息，但尚未影響模型ID。我已經有了更新模型的代碼。我只是試圖獲取用戶在下拉列表中選擇的項目的數據，以便他們可以確保自己是他們選擇的正確ID。單擊激活GetDetails的鏈接只是向用戶顯示更多關於他們將要在模型中更改的ID的信息。 – blacksaibot

這就是*正是你想要做的。您需要選擇的ID *，因爲用戶選擇它*。這意味着它發生在客戶端，所以你只能得到客戶端的信息。這意味着使用JavaScript。沒有其他辦法。 –

哦，好的。我現在明白了。謝謝。 – blacksaibot

在沒有FormMethod.Post的Dropdownlist中獲取SelectedItem

回答

相關問題