Перемещение вверх и перемещение элементов в списке

Question

У меня есть некоторые элементы, заполненные в списке из базы данных моего приложения asp.net mvc (C#).

Мне нужно дать возможность перемещать вверх или перемещать элементы в списке и сохранять их обратно в базу данных с обновленным заказом.

Мне нравится использовать jquery для перемещения вверх/перемещения по элементам в списке. Каков наилучший способ/душа, чтобы это сделать? Или есть лучший способ сделать это, кроме использования его со списком?

Answer 1

У меня нет кода, но есть несколько примеров в Интернете по перемещению div с помощью jQuery.

Мое предложение состояло в том, чтобы выровнять окно списка в пользу некоторых подвижных div или чего-то еще.

Something like this might help you. он использует список, который я думаю, и позволяет вам переупорядочить их. Затем вы можете выполнить jQuery новый порядок и сохранить его в базе данных.

Answer 2

Вы можете перемещать сторону детали клиента что-то вроде:

  $("#btnMoveSectionUp").click(function (e) { 
      var curr = $("#<%= lstEditReportSections.ClientID %> option:selected"); 
      if (curr.length == 0) return; 
      if (curr.index() > 0) { 
       var prev = curr.prev(); 
       curr.insertBefore(prev); 
      } 
     }); 
      $("#btnMoveSectionDown").click(function (e) { 
      var curr = $("#<%= lstEditReportSections.ClientID %> option:selected"); 
      if (curr.length == 0) return; 
      if (curr.index() < $("#<%= lstEditReportSections.ClientID %> option").length - 1) { 
       var next = curr.next(); 
       curr.insertAfter(next); 
      } 
     }); 

Но сервер не будет видеть изменения, сделанные на клиенте. Я использовал этот код для хранения всех значений в скрытом поле, а затем разделил его на стороне сервера.

  $("#<%= btnSaveReport.ClientID %>").click(function (e) { 
      if (confirm("Are you sure you want to save the report?") != true) return false; 
      var sections = $("#<%= lstEditReportSections.ClientID %> option").map(function() { 
       return $(this).val(); 
      }).get().join('#'); 
      $("#<%= hidEditReportSectionsList.ClientID %>").val(sections); 
     }); 

Возможно, это не идеальный вариант, но он сделал трюк для меня.