Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I am building a sortable list and need it to save the order to my wordpress database. I looked at this answer and it's helped but I am still getting an error. (It's a blank alert box) I think that I am missing something with the following but don't know where to put it:

$args= array(
'meta_key' => 'c3m_shown_on',
'meta_value'=> 'home'
'orderby' => 'menu_order',
'order' => 'ASC'
 );

 $box_query = new WP_Query($args);

Thanks for the help! I am using Wordpress Multisite - Version 3.8.1. Below is all of my code:

The HTML:

    <div id="tabs">
    <ul>
      <li><a href="#tabs-1">Tab One</a></li>
      <li><a href="#tabs-2">Tab Two</a></li>
    </ul>
    <div id="tabs-1">
       <div class="column">
          <div class="portlet">
          <div class="portlet-header">Feeds</div>
          <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
          </div>
          <div class="portlet">
          <div class="portlet-header">News</div>
          <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
          </div>
       </div><!-- END .column  -->
     </div><!-- END tab one -->
     <div id="tabs-2">
       <div class="column">
         <div class="portlet">
         <div class="portlet-header">Shopping</div>
         <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
         </div>
         <div class="portlet">
         <div class="portlet-header">Shopping</div>
         <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
         </div>
      </div><!-- END .column tab -->
    </div> <!-- END tab two -->

    <div id="loading-animation" style="float: left;padding: 10px;background-color: #09C"></div>

The jQuery (Sortable works perfectly):

    $( ".column" ).sortable({
       connectWith: ".column",
       handle: ".portlet-header",
       cancel: ".portlet-toggle",
       placeholder: "portlet-placeholder ui-corner-all",
    });
    $( ".portlet" )
       .addClass( "ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" )
       .find( ".portlet-header" )
       .addClass( "ui-widget-header ui-corner-all" )
       .prepend( "<span class='ui-icon ui-icon-minusthick portlet-toggle'> </span>");
    $( ".portlet-header" ).click(function() {
    var icon = $( this );
        icon.toggleClass( "ui-icon-minusthick ui-icon-plusthick" );
        icon.closest( ".portlet" ).find( ".portlet-content" ).toggle();
     });

     var $tabs = $( "#tabs" ).tabs();

And the part that doesn't work:

    $('#loading-animation').hide();


    var itemList = $(".column");
     itemList.sortable({
        update: function(event, ui) {
         $('#loading-animation').show(); // Show the animate loading gif while waiting

        opts = {
            url:  'http://mywebsite.com/wp-admin/admin-ajax.php', // ajaxurl is defined by WordPress and points to /wp-admin/admin-ajax.php
            type: 'POST',
            async: true,
            cache: false,
            dataType: 'json',
            data:{
                action: 'item_sort', // Tell WordPress how to handle this ajax request
                order: itemList.sortable('toArray').toString() // Passes ID's of list items in  1,3,2 format
            },
            success: function(response) {
                $('#loading-animation').hide(); // Hide the loading animation
                alert('It Worked!!');
                return; 
            },
            error: function(xhr,textStatus,e) {  // This can be expanded to provide more information
                alert(e);
                 alert('There was an error saving the updates');
                $('#loading-animation').hide(); // Hide the loading animation
                return; 
            }
        };
        $.ajax(opts);
    }
}); 

And the functions part:

    function my_save_item_order() {
    global $wpdb;

      $order = explode(',', $_POST['order']);
      $counter = 0;
         foreach ($order as $item_id) {
         $wpdb->update($wpdb->posts, array( 'menu_order' => $counter ), array( 'ID' => $item_id) );
         $counter++;
           }
         die(1);
        }
    add_action('wp_ajax_item_sort', 'my_save_item_order');
    add_action('wp_ajax_nopriv_item_sort', 'my_save_item_order');

Thanks for helping ... and thanks for the initial code Somatic

share|improve this question
    
What is "a blank error box"? –  kaiser Feb 25 at 21:02
    
I get a pop-up box that is empty except for the "OK" button (only option). After that I get the alert (pop-up box) that I added in the code for when it fails. –  Katie Feb 26 at 21:02

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.