在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切换图像

回答

相关问题