通過用戶控制ASP.NET MVC數據反饋

Question

在我們的新產品中，我們有一些數據輸入字段，要求您搜索正確的值以放置在此字段中。

當你進入這個數據輸入字段時，我想通過視圖上的某個東西（可能是一個Ajax實現）提供一個搜索選項，並允許搜索數據庫的值，但是當結果返回時，我想爲其他不受搜索影響的字段保留現有值。

但我不知道如何用MVC做到這一點。有沒有人有這方面的建議？

Answer 1

爲ASP.NET MVC視圖編寫數據輸入頁面的常用方法爲 。 讓它在沒有Ajax的情況下工作 （例如，在 中您只需輸入值，而不需要 自動完成，則提交工作正常）。

爲用戶執行特定操作（例如，在某個控件內按下某個鍵）時調用的JavaScript方法編寫原型。但是這在你的aspx頁面的腳本標籤內。不幸的是，在我的例子中堆棧溢出似乎「淨化」了腳本標記，所以我不能證明那部分。但你是JavaScript的原型將是這個樣子：

function startAutoComplete() { 
} 

現在掛鉤上的用戶界面控件的事件處理程序。您需要調用剛剛爲您的應用程序創建適當事件處理程序的函數。根據你的描述，這聽起來像你可能想要使用onkeydown，但有lots of events to choose from。您可能需要處理多個事件，以適合您的應用程序。

到目前爲止，我們所做的一切都是標準的aspx和JavaScript。在這一步中，我們將完成整個過程中唯一與ASP.NET MVC完全不同的部分。你需要添加一個動作到你的控制器，這個動作將被你剛剛編寫的JavaScript原型（間接）調用。該動作應接受適當的輸入（例如，表示來自控件的文本的字符串或類似的內容，適合您的應用程序）並以JSON格式返回其結果。我將在這裏展示一個非常簡單的例子。隨時在實際應用中替代更復雜的代碼。

public ActionResult GetSuggestions(string searchText) 
{ 
    return Json(new {SearchText = searchText}); 
} 

本示例只返回包含一個屬性的JavaScript對象，其中包含傳遞給該函數的值。就像你說的，你可以寫一些對你的應用程序更有用的東西。

現在您需要在JavaScript中調用此函數。該URI看起來像：

http://localhost/mycontroller/GetSuggestions?searchText=Foo 

它有可能使Ajax調用沒有一個JavaScript庫，但如果你使用jQuery或爲您處理跨瀏覽器兼容性問題的一些其他圖書館要容易得多。由於我碰巧喜歡jQuery，我會證明這一點。讓我們更新startAutoComplete方法我們前面原型：

function startAutoComplete() { 
    var searchText = $("#myeditorid").text(); 
    $.getJSON("/mycontroller/GetSuggestions?searchText=" + searchText, 
     null, 
     autoCompleteResponse); 
} 

第一行用了jQuery及時與ID myeditorid控件中的文本。我們將它作爲searchText參數傳遞給ASP.NET MVC操作，並將其作爲查詢字符串參數追加。

下一行以$ .getJSON開頭，它調用一個jQuery函數，該函數會對您指定的URI進行Ajax調用。我們傳遞一個參數autoCompleteResponse，它是在Ajax調用的響應成功時調用的JavaScript方法的名稱。現在我們必須編寫autoCompleteResponse。

function autoCompleteResponse(data) { 
    if (data.SearchText) 
    { 
     $("#myeditorid").text(data.SearchText); 
    } 
} 

這上面說，「如果返回的數據具有SEARCHTEXT屬性，設置控制該值的文本。」再次，用返回的數據爲您的應用程序做適合的操作。