首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

将JQuery Sortable(新订单)保存到ASP.Net MVC控制器?

在ASP.Net MVC控制器中保存JQuery Sortable(新订单)的方法可以通过以下步骤实现:

  1. 首先,在前端页面中使用JQuery Sortable插件创建可拖拽的排序列表。确保在页面中引入JQuery和JQuery Sortable插件的相关文件。
  2. 在前端页面中,使用JavaScript代码监听排序列表的变化,并将新的排序顺序保存到一个数组中。
  3. 使用AJAX技术将保存了新排序顺序的数组发送到后端的ASP.Net MVC控制器。
  4. 在后端的ASP.Net MVC控制器中,接收到前端发送的新排序顺序数组。
  5. 在控制器中,可以将接收到的新排序顺序数组保存到数据库中,或者进行其他相关的业务逻辑处理。

下面是一个示例代码:

前端页面代码:

代码语言:html
复制
<ul id="sortable">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
</ul>

<script>
$(function() {
  $("#sortable").sortable({
    update: function(event, ui) {
      // 获取新的排序顺序
      var newOrder = [];
      $("#sortable li").each(function() {
        newOrder.push($(this).text());
      });

      // 发送新排序顺序到后端控制器
      $.ajax({
        url: "/Controller/SaveSortableOrder",
        type: "POST",
        data: { order: newOrder },
        success: function(response) {
          // 处理保存成功后的逻辑
        },
        error: function() {
          // 处理保存失败后的逻辑
        }
      });
    }
  });
});
</script>

后端ASP.Net MVC控制器代码:

代码语言:csharp
复制
public class Controller : Controller
{
  [HttpPost]
  public ActionResult SaveSortableOrder(List<string> order)
  {
    // 将新排序顺序保存到数据库或进行其他相关处理
    // ...

    return Json(new { success = true });
  }
}

这样,当用户在前端页面中拖拽排序列表的顺序时,会触发JQuery Sortable的update事件,然后通过AJAX将新的排序顺序发送到后端的ASP.Net MVC控制器中进行保存或处理。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券