如何将选项注入到小部件表单内的选择标记中?

时间:2015-12-10 作者:stardester

我创建了一个小部件,它从数据库中检索文件名,现在正试图将文件名作为选项输出到admin小部件菜单(小部件类中的form函数)内的select标记中。

目前情况如下:

function form($instance) {
    ?> <script type="text/javascript">
            jQuery(document).ready(function($){
               var data = {
            \'action\'  : \'clc_return_imagefilenames\'
                    };
                    // send ajax request
                    jQuery.post(ajaxurl, data, function(response) {
                        // parse response and add slides
                    retrievedImagenames = JSON.parse(response);
                    for(var i = 0; i < retrievedImagenames.imagenamestoreturn.length; i++){
                            filename = retrievedImagenames.imagenamestoreturn[i][\'filename\'];
                            jQuery("<?php echo $this->get_field_id( \'filenames\' );?>").html(\'<option value="\'+filename+\'">\'+filename+\'</option>\');
                        }
                    }); 
            });

                    </script>

        <select id="<?php echo $this->get_field_id( \'filenames\' ); ?>" name="<?php echo $this->get_field_id( \'filenames\' ); ?>" size="10" multiple="multiple" tabindex="1"></select>

        <?php
计划是通过AJAX获取文件名(很好,我测试过),然后用jQuery将它们附加到select标记中。

问题是什么都没发生。。。服务器或AJAX没有问题,文件名已设置,我可以在控制台中看到返回的JSON对象,甚至可以使用jQuery输出它们。但它没有将它们附加到select标签上,我也不知道为什么。

1 个回复
最合适的回答,由SO网友:jgraup 整理而成

问题出在jQuery语句中。你通过了get_field_id 但没有# 它正在寻找tag 不是和id. 第二件事是,即使这样做有效,您也只能用一个文件名替换内容,使用html 但您应该使用append.

下面是一个快速测试,以突出显示这些区域。

function form_test () {

  $field_id = \'test_xyz\';

  ?><select id="<?php echo $field_id; ?>" name="<?php echo $field_id; ?>" size="10" multiple="multiple" tabindex="1"></select>

  <script type="text/javascript">
  jQuery(document).ready(function($){

    var data = [\'fileA\', \'fileB\', \'fileC\'];

    for(var i = 0; i < data.length; i++){
        var filename = data[i];
        jQuery( "#<?php echo $field_id; ?>").append(\'<option value="\'+filename+\'">\'+filename+\'</option>\');
      }

  });
  </script><?php
}

add_filter (\'the_content\', function($content){  return $content.form_test(); });
您的代码最终看起来更像

function form ($instance) {

  $field_id = $this->get_field_id( \'filenames\' );

    ?><select id="<?php echo $field_id; ?>" name="<?php echo $field_id; ?>" size="10" multiple="multiple" tabindex="1"></select>

    <script type="text/javascript">
      jQuery(document).ready(function($){
        var data = { \'action\'  : \'clc_return_imagefilenames\' };
        // send ajax request
        jQuery.post(ajaxurl, data, function(response) {
          // parse response and add slides
          var retrievedImagenames = JSON.parse(response);
          for(var i = 0; i < retrievedImagenames.imagenamestoreturn.length; i++){
            var filename = retrievedImagenames.imagenamestoreturn[i][\'filename\'];
            jQuery( "#<?php echo $field_id; ?>").append(\'<option value="\'+filename+\'">\'+filename+\'</option>\');
          }
        });
      });
    </script><?php
  }

相关推荐

JqueryUi对话框给出未捕获的TypeError:This._addClass不是函数错误

我有一个网站,我们需要一些自定义php编码来连接到外部数据库,以获取几个销售我们产品的供应商的产品评论URL。我们试图实现的基本想法是让用户注册他们的产品,然后如果他们愿意留下评论,就延长保修期。我正在使用XYZScript。com的“插入PHP”插件来实现这一点。该主题最初只加载了jQuery,以避免创建子主题,我们正在php脚本中加载jQueryUI。因此,我们将jQuery加载到文档的标题中,将jQueryUI加载到文档的正文中。我不太确定这是因为加载脚本的顺序造成的,还是其他一些冲突的javasc