是否可以有效地使主题定制器部分可排序并在保存后保持顺序?

时间:2018-07-11 19:59:54

标签: jquery wordpress jquery-ui jquery-ui-sortable

我们确实有kirki(主题定制工具)sortable field。但是我想对部分本身应用相同的逻辑,而不是使用可排序字段创建另一个部分。  我现在使用选项而不是主题模块,只是为了更好地可视化。  到目前为止,我尝试过的事情:  在functions.php中,我在下面使用此代码在选项表中创建选项行:

$sortable_sections = get_option('sortable_sections');
  if(!isset($sortable_sections) OR empty($sortable_sections)){
  add_option('sortable_sections', array('eat', 'pray','love'));
}

kirki-config.php中需要的名为functions.php的文件中创建节的代码,如下所示

$sortable_sections = get_option('sortable_sections');
foreach($sortable_sections as $sortable_section){
 Kirki::add_section( $sortable_section, array(
    'title'          => esc_attr__( strtoupper($sortable_section), 'airspace' ),
    'description'    => esc_attr__( 'Insert content', 'airspace' ),
    'panel'          => 'frontpage_panel',
) );
}

上面的代码创建了三个部分,分别具有ID吃,祈祷和爱。

js中的代码如下:(文件钩接到admin_enqueue_scripts

jQuery( document ).ready(function($) {

  $('#sub-accordion-panel-frontpage_panel').sortable({
    items: '.control-section-kirki-default',
    axis : 'y',
    cursor: 'move,
   update: function(){
      //here i want the code which gets the updated reordered array and passed to a  
      //php file using .sortable('serialize'), only after clicking the publish
     // button. the problem is the publish button is disabled even after
    // sections got new positions.
   }
  });
});

在php文件中,我想要的代码如下:

$new_array = $_POST['accordion-section'];
update_option('sortable_sections', $new_array);

所以我要完成两个步骤。 1.启用和禁用发布按钮 2.单击按钮js变量后,转到php文件并更新该选项。

如何实现它,还有没有更好的方法来实现它?

1 个答案:

答案 0 :(得分:0)

当单击“发布”时,我会获取您的数据。

NSString *body = [plist objectForKey:@"foo"];
NSString *htmlString = 
    [NSString stringWithFormat:@"<font face='PingFangSC-Light' size='3'>%@", body];
[webView loadHTMLString:htmlString baseURL:nil];

由于您尚未提供MCVE,因此我可以提供所有建议。

更新

(function($) {
  $("#sub-accordion-panel-frontpage_panel").sortable({
    items: "> .control-section-kirki-default",
    axis : "y",
    cursor: "move"
  });
  $("#publish").click(function(e){
    e.preventDefault();
    var panelOrder = $("#sub-accordion-panel-frontpage_panel").sortable("serialize");
    // Submit data to PHP
  });
})(jQuery);