Question

我尝试过以下两种方式之一：

在form类的Widget方法（扩展WP_Widget）中，我有以下代码段，它设置了一个全局javascript变量：

if( $instance ) :
?>
    <script type="text/javascript">
        window.widget_order_name = "<?php echo $this->get_field_name( 'order' ) ?>";
    </script>
<?php
endif;

在小部件管理标记中，我还尝试创建以下html结构：

<div
  field_name='<?php echo $this->get_field_name( 'order' ) ?>'
  id='order_field_name'
  class='hidden'>
</div>

在我的widget admin javascript文件中，我以两种方式之一获取此field_name的值（如下所示），然后将该小部件名称附加到隐藏输入字段的名称（包含我想要存储的值）

第一种方式，使用window.widget_order_name：

var widget_field_name = window.widget_order_name;

第二种方式，使用jQuery抓取field_name：

var widget_field_name = $( '#order_field_name' ).attr( 'field_name' );

我的问题：

每当我第一次将小部件从Available Widgets容器移动到我的侧边栏时，我都没有得到实际的字段名称，而是获得了字段名称的占位符。

所以，而不是得到这样的东西：

<input 
  type="hidden" 
  name="widget-hours-widget[2][order][]"
  value="L48">

我明白了：

<input 
  type="hidden" 
  name="widget-hours-widget[__i__][order][]" 
  value="L26">

点击保存按钮后，field_name会为我提供正确的小部件名称widget-hours-widget[2]，而不是占位符widget-hours-widget[__i__]。

是否有人遇到过类似问题或者知道如何修复它？

感谢。

Answer 1

问题

所以我弄清楚问题是什么。在下面的语句中，jQuery抓住了第一个id为#order_field_name的元素。

var widget_field_name = $( '#order_field_name' ).attr( 'field_name' );

事实证明，实际上有两个带的元素。具有此id的第一个元素是 Available Widgets 部分中的小部件。这是您点击＆amp;部分的部分。将小部件拖动到侧边栏。这是jQuery选择器返回给我的元素。

The widget name and description.

标记：

enter image description here

解决方案

我有一个点击监听器，它动态添加带有字段名称的隐藏输入框。因此，我使用jQuery的树遍历方法返回到widget的form元素，然后遍历到具有#order_field_name id的元素。从那里，我抓住了field_name属性，该属性具有正确的field_name。

$( 'a.add-schedulable' ).click( function( evt ) {

  // ... code omitted ...

  var widget_field_name = $( this ).parents( 'form' ).find( '#order_field_name' ).attr( 'field_name' );

   // ... code omitted ...
});

从那里开始，我使用了一些javascript＆amp; jQuery创建一个具有所需属性的隐藏输入元素，它看起来与此类似：

<input 
  type="hidden" 
  name="widget-hours-widget[3][order][]" 
  value="L13">

Wordpress小部件：将$ this-＆gt; get_field_name（）传递给javascript

我尝试过以下两种方式之一：

我的问题：

1 个答案:

问题

解决方案