在ASP.NET MVC中創建一個AJAX切換圖像

所以我想爲表創建一個切換按鈕，在那裏我可以進行異步調用來更新數據庫記錄（啓用/禁用）。在ASP.NET MVC中創建一個AJAX切換圖像

一些試驗和錯誤後，我設法得到它的工作 - 但它的感覺就像必須有一個更優雅的方式。

我不喜歡在我的控制器中重複我的圖像標籤，很明顯......我怎樣才能以優雅的方式避免這種情況？
有沒有一個更好的方法來處理這個問題呢？

這是我在控制器代碼：

public ActionResult ToggleEnabled(int id) 
    { 
     if (Request.IsAjaxRequest()) 
     { 
      var p = this.PageRepository.GetPage(id); 
      p.Enabled = p.Enabled != true; 
      this.PageRepository.Edit(p); 
      return p.Enabled ? Content("<img src='/Content/icons/tick.png' border=0 />") : Content("<img src='/Content/icons/tick_grey.png' border=0 />"); 
     } 
     return Content("Error"); 
    }

和視圖...：

<% var img = Model.Enabled ? "tick.png" : "tick_grey.png"; %> 
<% foreach (var item in Model) 
     { %> 
... 
<td align="center"> 
    <%=Ajax.ActionLink("[replacethis]", 
     "ToggleEnabled", 
       new { id = Model.ID }, 
       new AjaxOptions { UpdateTargetId = "toggleimage" + Model.ID }).Replace("[replacethis]", 
       string.Format("<div id='toggleimage{0}'><img src='/Content/icons/{1}' border='0' alt='toggle'/></div>", 
       Model.ID, Model.Enabled ? "tick.png" : "tick_grey.png"))%> 
</td> 
... 
<% } %>

訣竅/使用圖像與Ajax.Actionlink黑客發現here 。

來源

2009-07-03 Kjensen

我其實很喜歡你做到這一點。我沒有看到任何明顯的方法來簡化它。正如你所指出的，你的圖像邏輯在控制器和視圖中是重複的，但你需要視圖中的邏輯來加載頁面，並且你需要控制器中的邏輯來進行Ajax調用。 – 2009-07-04 01:02:52

試圖在剃刀Mvc 3中重寫這個，我得到一個「替換」的錯誤。它說System.Web.MVC.MVChtmlString不包含defintion ... – Chaka 2012-12-23 15:30:40

如何根據模型是否啓用渲染複選框。

在jQuery中，您可以將這些複選框替換爲您的圖像。像

您的document.ready代碼的東西可能看起來像，

$(document).ready(
function() 
{ 
    $('.enabledCheckbox').each(
     function() 
     { 
      var image = $(this).checked ? 'tick.png' ? 'tick_grey.png'; 
      $(this).parent.click(
       function() 
       { 
        if($(this).is('image')) 
         toggleEnabledStatus(); //write code in toggleEnabledStatus to toggle the state of the model on server side. 
       }  
       ); 
      $(this).parent.html('<img src=' + image + '/>'); 
     } 
    ); 
} 
);

或者，你可以使用插件像jquery-checkbox給他們你可以想到的任何花哨的造型。

來源

2009-07-04 04:41:49 SolutionYogi

如果優雅是你想要的，我會使用一個jQuery web服務請求來向底層的ASPX頁面發出一個AJAX請求。它非常優雅，因爲您在ASPX頁面上的所有需求都是一個靜態的[WebMethod]來執行實際操作，以及來自jQuery的$ .ajax（）調用。

來源

2009-07-04 01:55:39

在ASP.NET MVC中創建一個AJAX切換圖像

回答

相關問題