Пожарная сортировка при нажатии кнопки - PullRequest
2 голосов
/ 24 марта 2020

У меня есть 3 деления, в которых я перетаскиваю значение, но в то же время происходит событие div sortable. Как я могу запустить сортируемое событие после того, как я закончу sh drag and procedure.

Используя сначала приведенный ниже код, я перетаскиваю.

var pushSectionIdvalueLayer1 = [];
var pushSectionIdvalueLayer2 = [];
var pushSectionIdvalueLayer3 = [];
var sectionDataLayer1 = [];
var sectionDataLayer2 = [];
var sectionDataLayer3 = [];
$(function() {
  var bSortable1Show = false;
  var bSortable2Show = false;
  var bSortable3Show = false;
  var iTotalItems = $("ul#sectionlist").children().length;
  var iCntSortable1 = $("ul#sortable1").children().length;
  var iCntSortable2 = $("ul#sortable2").children().length;
  var iCntSortable3 = $("ul#sortable3").children().length;

  function triggerSortable() {
    var iCntSortable1 = $("ul#sortable1").children().length;
    var iCntSortable2 = $("ul#sortable2").children().length;
    var iCntSortable3 = $("ul#sortable3").children().length;
    $(".ul-container").removeClass('connected ui-sortable');
    $(".ul-container").addClass('not-connected');
    if (iCntSortable1 == 0) {
      $("ul#sortable1").addClass('connected ui-sortable');
    } else if (iCntSortable1 > 0 && iCntSortable1 === (iCntSortable2 + 1)) {
      $("ul#sortable2").addClass('connected ui-sortable');
    } else if (iCntSortable1 > 0 && iCntSortable1 === iCntSortable2 && iCntSortable2 === (iCntSortable3 + 1)) {
      $("ul#sortable3").addClass('connected ui-sortable');
    } else if (iCntSortable1 > 0 && iCntSortable1 === iCntSortable2 && iCntSortable2 === iCntSortable3) {
      $("ul#sortable1").addClass('connected ui-sortable');
    }
  }
  $(".connected").sortable({
    connectWith: ".connected",
    start: function(event, ui) {
      triggerSortable();
    },
    update: function(event, ui) {
      triggerSortable();
    }
  }).disableSelection();
  triggerSortable();
});

Параллельно 3 div sortable события пожаров. Я хочу запустить это событие после завершения моей операции.

$(function() {
  $("#sectionlist").sortable({
    update: function(e, ui) {
      items = $("#sectionlist li");
      preference = 0;
      for (var x = 0; x < items.length; x++) {
        preference += 1;
      }
    }

  }).disableSelection();
});
$(function() {
  $("#sortable1").sortable({
    update: function(e, ui) {
      items = $("#sortable1 li");
      preferenceLayer1 = 0;
      sectionDataLayer1 = [];
      check = [];
      pushSectionIdvalueLayer1 = [];
      for (var x = 0; x < items.length; x++) {
        pushSectionIdvalueLayer1.push(preferenceLayer1);
        sectionDataLayer1.push(items[x].id);

        preferenceLayer1 += 1;
      }
    }

  }).disableSelection();
});
$(function() {
  $("#sortable2").sortable({
    update: function(e, ui) {
      items = $("#sortable2 li");
      preferenceLayer2 = 0;
      sectionDataLayer2 = [];
      pushSectionIdvalueLayer2 = [];
      for (var x = 0; x < items.length; x++) {
        pushSectionIdvalueLayer2.push(preferenceLayer2);
        sectionDataLayer2.push(items[x].id);
        preferenceLayer2 += 1;
      }
    }

  }).disableSelection();
});
$(function() {
  $("#sortable3").sortable({
    update: function(e, ui) {
      items = $("#sortable3 li");
      //console.log(items.length);
      preferenceLayer3 = 0;
      sectionDataLayer3 = [];
      pushSectionIdvalueLayer3 = [];
      for (var x = 0; x < items.length; x++) {
        pushSectionIdvalueLayer3.push(preferenceLayer3);
        sectionDataLayer3.push(items[x].id);
        preferenceLayer3 += 1;
      }
    }
  }).disableSelection();
});

Вот мой HTML код

<table id="classTable" class="table table-bordered">
  <thead>
  </thead>
  <tbody>


    <tr>
      <td>Level 1</td>
      <td>Level 2</td>
      <td>Level 3</td>
      <td>All Section</td>
      <td>
        <asp:Button ID="btnSave" runat="server" Text="Save" class="btn btn-primary" OnClick="btnSave_Click" />
      </td>
    </tr>
    <tr>
      <td>
        <ul id="sortable1" class="ul-container connected" title="Level1">
          <li></li>
        </ul>
      </td>
      <td>
        <ul id="sortable2" class="ul-container connected" title="Level2">
          <li></li>
        </ul>
      </td>
      <td>
        <ul id="sortable3" class="ul-container connected" title="Level3">
          <li></li>
        </ul>
      </td>
      <td>
        <ul id="sectionlist" class="connected" title="SectionName" style="overflow:scroll;height:400px;">
        </ul>
      </td>
    </tr>

  </tbody>
</table>

Я хочу запустить этот СОРТИРУЕМЫЙ КОД в тот момент, когда администратор нажимает на кнопку.

Я пробовал это, но это не работает:

$("#<%= btnSave.ClientID %>").on('click', function() {
  $('#sortable1').sortable('option', 'update');
  $('#sortable2').sortable('option', 'update');
  $('#sortable3').sortable('option', 'update');
});

Вот решение моего ВОПРОСА: - Пожалуйста, посмотрите

  $("#<%= btnSave.ClientID %>").on('click', function () {

            if (qString == "1") {
                //debugger;
                updateDivInEditMode();               
            }
});
function updateDivInEditMode() {
            //For Level1 
            var items1 = $("#sortable1 li");
            var preferenceLayer1 = 0;
            sectionDataLayer1 = [];
            check = [];
            pushSectionIdvalueLayer1 = [];
            for (var x = 0; x < items1.length; x++) {
                pushSectionIdvalueLayer1.push(preferenceLayer1);
                sectionDataLayer1.push(items1[x].id);

                preferenceLayer1 += 1;
            }
            //For Level2
            var items2 = $("#sortable2 li");
            var preferenceLayer2 = 0;
            sectionDataLayer2 = [];
            pushSectionIdvalueLayer2 = [];
            for (var x = 0; x < items2.length; x++) {
                pushSectionIdvalueLayer2.push(preferenceLayer2);
                sectionDataLayer2.push(items2[x].id);
                preferenceLayer2 += 1;
            }
            //For Level3
            var items3 = $("#sortable3 li");
            var preferenceLayer3 = 0;
            sectionDataLayer3 = [];
            pushSectionIdvalueLayer3 = [];
            for (var x = 0; x < items3.length; x++) {
                pushSectionIdvalueLayer3.push(preferenceLayer3);
                sectionDataLayer3.push(items3[x].id);
                preferenceLayer3 += 1;
            }
        }

Я снова использовал тот же код в отдельной функции

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...