WP如何实现拖拉排序

---

JS 发送ajax 和添加jquery ui sortable

jQuery(document).ready(function($){
  var movieSortList = $('ul.movie-sort-list');
  var loading = $('.loading');
  var saveMsg = $('.order-save-msg');
  var saveErr = $('.order-save-err');

  movieSortList.sortable({
    update:function(e,ui) {
      loading.show();

      $.ajax({
        url:movieSort.ajaxurl,
        type:'post',
        dataType:'json',
        data:{
          action:'save_order',
          order:movieSortList.sortable('toArray'),
          token:movieSort.token,
        },
        success:(res) => {
          loading.hide();
          if (res.success) {
            saveMsg.show();
            setTimeout(function(){saveMsg.hide()},3000);
          } else {
            saveErr.text(res.responseText);
            saveErr.show();
            setTimeout(function(){saveErr.hide()},3000);
          }
        },
        error:(err) => {
          saveErr.text(err.responseText);
          saveErr.show();
          setTimeout(function(){saveErr.hide()},3000);
        }
      })
    },


  })

});

PHP 添加wp ajax 函数 实现后台更新

function ml_save_order()
{
  // Check nonce token
  if (!check_ajax_referer( 'ml-token', 'token' )) {
    wp_send_json_error('Invalid token');
    return;
  }

  // Check user capability 
  if (!current_user_can( 'manage_options' )) {
    wp_send_json_error('Not authorized');
    return;
  }

  $order = $_POST['order'];

  $counter = 0;

  foreach ($order as $listing_id) {
    $listing = array(
      'ID'  => (int)$listing_id,
      'menu_order'  => $counter
    );

    // Debugging statement
    //var_dump($listing);

    $result = wp_update_post($listing);

    // Debugging statement
    //var_dump($result);

    if ($result === 0 || $result === false) {
      wp_send_json_error('Error updating post ID ' . $listing_id);
      return;
    }

    $counter++;
  }

  wp_send_json_success('LISTING ORDER SAVED');
}

add_action( 'wp_ajax_save_order', 'ml_save_order' );

---