向 InsertionMode 枚举添加附加值

Question

如何向 InsertionMode 枚举添加其他值？

我试过了

public class MyAjaxOptions : AjaxOptions
{
    public new InsertionModeCustom InsertionMode;
}

public enum InsertionModeCustom
{
    Replace = 0,
    InsertBefore = 1,
    InsertAfter = 2,
    ReplaceWith = 3,
    AppendTo = 4,
    PrependTo = 5
}

但是，一旦将 MyAjaxOptions 传递给 Ajax.ActionLink，MyAjaxOptions 就会被强制转换回 System.Web.Mvc.Ajax.AjaxOptions，因此 InsertionMode 不是 enum InsertionModeCustom，而是返回到 enum InsertionMode。由于 AppendTo 和 PrependTo 不再存在，该值变为 Replace（作为第一个值）。

Answer 1

针对缺少您所询问的功能（enums 的继承），这是在 cmets 中指出的（here 和 here），也许另一种方法可以为您的预期任务提供解决方法。

正如您所说的 here（这可能更好地放在 OP 中），您的意思是 向表中插入或追加行。 为此，您可能会在

中所示的两步法中找到（部分？）解决方法

1. Ajax.ActionLink insert after header in a table?

2. How To add a row to table by ajax actionlink

Answer 2

正如您所发现的，无法扩展 ActionLink 接受的 InsertionMode 枚举。

也就是说，如果你重新审视你试图解决的核心问题，那么这种方法就没有必要了。

Ajax.ActionLink 唯一要做的就是生成一个 HTML 锚标记。您可以通过替换无效调用来创建相同的标签（使用您的AppendTo 选项）：

@Ajax.ActionLink("Append To Table", "GetRowData",
    new AjaxOptions
    {
        HttpMethod = "GET",
        InsertionMode = InsertionMode.AppendTo,
        UpdateTargetId = "myAjaxData",
    });

与：

@Html.ActionLink("Append To Table", "GetRowData", null, 
    new { 
            data_ajax = "true", 
            data_ajax_method = "GET", 
            data_ajax_mode = "appendTo", 
            data_ajax_update = "myAjaxData"
    }
);

这会产生与您已经能够扩展枚举相同的锚标记。

就解决方案而言，这只是故事的一半，因为您还需要修改 Unobtrusive JavaScript 库以处理您的新 AppendTo 和 PrependTo 选项（不推荐）.

Unobtrusive JavaScript 为每个具有data-ajax="true" 属性的锚标记添加点击处理程序。如果它检测到无效的InsertionMode，它将默认为InsertionMode.Replace。

如果您特别想使用Ajax.ActionLink，一个解决方案是使用其标准功能更新隐藏的 div，然后调用 JS 函数将数据追加/追加到表中：

Index.cshtml：

@Ajax.ActionLink("Prepend To Table", "GetRowData",
             new AjaxOptions
             {
                 HttpMethod = "GET",
                 InsertionMode = InsertionMode.Replace,
                 UpdateTargetId = "myAjaxData",
                 OnComplete = "prependToTable('#tableOfDoubles', '#myAjaxData');"
             });

@Ajax.ActionLink("Append To Table", "GetRowData",
             new AjaxOptions
             {
                 HttpMethod = "GET",
                 InsertionMode = InsertionMode.Replace,
                 UpdateTargetId = "myAjaxData",
                 OnComplete = "appendToTable('#tableOfDoubles', '#myAjaxData');"
             });

<div id="myAjaxData" style="display:none;">
  data will end up here
</div>

<table style="border-spacing: 7px; border-collapse: separate;">
  <thead>
    <tr>
      <th>Number</th>
      <th>Number doubled</th>
    </tr>
  </thead>
  <tbody id="tableOfDoubles">
    <tr>
      <td>1</td>
      <td>2</td>
    </tr>
  </tbody>
</table>

JavaScript：

<script type="text/javascript">
  function prependToTable(tableId, dataId) {
    try {
      var newData = JSON.parse($(dataId).text());
      var row = ("<tr><td>" + newData.Number + "</td><td>" + newData.Doubled + "</td></tr>");
      $(tableId).prepend(row);
    } catch (ex) {
      console.error(ex);
    }
  }

  function appendToTable(tableId, dataId) {
    try {
      var newData = JSON.parse($(dataId).text());
      var row = ("<tr><td>" + newData.Number + "</td><td>" + newData.Doubled + "</td></tr>");
      $(tableId).append(row);
    } catch (ex) {
      console.error(ex);
    }
  }
</script>

控制器：

using System.Web.Mvc;
using System.Web.Script.Serialization;

namespace AjaxActionLink.Models
{
    public class MyData
    {
        public int Number { get; set; }
        public int Doubled => Number * 2;
    }
}

namespace AjaxActionLink.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public string GetRowData()
        {
            JavaScriptSerializer js = new JavaScriptSerializer();

            // generate demo data
            int someNumber = (int)(Session["tableRowValue"] ?? 1);
            Session["tableRowValue"] = ++someNumber;
            // end of data generation

            var newData = new MyData { Number = someNumber };
            return js.Serialize(newData);
        }
    }
}

说了这么多，我个人只是将onclick 处理程序添加到标签并使用jQuery（like this）进行ajax 调用，使用我上面的函数将响应添加到表中。