动态添加Widget表单域

时间：2013-03-02 作者：Ole Henrik Skogstrøm

我正在尝试向WordPress小部件动态添加表单字段。因此，如果用户希望向事件添加其他日期，他们可以单击按钮获取更多字段。

问题是：How do save newly created input fields to my database?是否需要编写自定义更新函数？有什么建议吗？

小部件的外观如下：enter image description here

这是我的小部件php代码（到目前为止）：

    class Spillelister extends WP_Widget {

    public function Spillelister() {

        $widget_options = array (
            \'classname\' => \'spillelister-widget\',
            \'description\' => \'Widget for å illustrere spillelister.\');

        parent::WP_Widget(\'spillelister_widget\', \'Spilleplan\', $widget_options);
    }

    // The actual widget user interface
    public function widget($args, $instance) {

        extract( $args, EXTR_SKIP);
        $title = ( $instance[\'title\'] ) ? $instance[\'title\'] : \'Spilleplan\';
        $body = ( $instance[\'body\'] ) ? $instance[\'body\'] : \'Ingen flere forestillinger\';

        ?>

            <?php echo $before_widget; ?>
            <?php echo $before_title . $title . $after_title; ?>
            <p><?php echo $body; ?></p>

        <?php
    }

    public function update() {

    }

    public function form() {
    ?>
        <div class="date_stamp">
        <p>
            <label>Dato</label> <input type="text" class="datepicker">
            <br>
            <label>Tid</label> <input type="text">
            <span class="remove">Remove</span>
        </p>
        </div>
        <p>
            <span class="add">Add fields</span>
        </p>

    <?php 
    }


}

function spillelister_init() {
    register_widget(\'Spillelister\');    
}
add_action(\'widgets_init\', \'Spillelister_init\');
欢迎提供任何提示、提示或答案。：）

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

有趣的问题
我从未见过小部件中使用的可重复字段。给出一个完整的答案需要太多的工作/时间，因此我将为您提供指向我所知道的资源的链接，希望您能做到这一点，并与我们共享解决方案；）

所有这些示例都涉及元框，您需要复制jQuery脚本并调整post_meta 小部件案例。

SO网友:HKandulla

这是一个呈现两个字段（图像id和url）的动态小部件的示例。如果输入图像id并按“更新”，将添加两个新字段。我构建它是为了创建一个带有图像和链接url的光滑滑子。

<?php

class imp_image_slider extends WP_Widget
{
/**
 * imp_image_slider constructor.
 */
public function __construct()
{
    parent::__construct(false, $name = "Impulse Image Slider", array("description" => "Creates Slick Image Slider"));
}

/**
 * @see WP_Widget::widget
 *
 * @param array $args
 * @param array $instance
 */
public function widget($args, $instance)
{
// render widget in frontend
}


/**
 * @see WP_Widget::update
 *
 * @param array $newInstance
 * @param array $oldInstance
 *
 * @return array
 */
public function update($newInstance, $oldInstance)
{
    $instance = $oldInstance;
    $instance[\'images\'] = array();
    $instance[\'urls\'] = array();
    if (isset($newInstance[\'images\'])) {
        foreach ($newInstance[\'images\'] as $key => $value) {
            if (!empty(trim($value))) {
                $instance[\'images\'][$key] = $value;
                $instance[\'urls\'][$key] = $newInstance[\'urls\'][$key];
            }
        }
    }

    return $instance;
}

/**
 * @see WP_Widget::form
 *
 * @param array $instance
 */
public function form($instance)
{
    $images = isset($instance[\'images\']) ? $instance[\'images\'] : array();
    $urls = isset($instance[\'urls\']) ? $instance[\'urls\'] : array();
    $images[] = \'\';
    $form = \'\';

    foreach ($images as $idx => $value) {
        $image = isset($images[$idx]) ? $images[$idx] : \'\';
        $url = isset($urls[$idx]) ? $urls[$idx] : \'\';
        $form .= \'<p>\'
            . \'<label>Slides:</label>\'
            . sprintf(
                \'<input type="text" name="%1$s[%2$s]" value="%3$s" class="widefat" placeholder="Image ID">\',
                $this->get_field_name(\'images\'),
                $idx,
                esc_attr($image))
            . \'</p>\'
            . \'<p>\'
            . sprintf(
                \'<input type="text" name="%1$s[%2$s]" value="%3$s" class="widefat" placeholder="Url">\',
                $this->get_field_name(\'urls\'),
                $idx,
                esc_attr($url))
            . \'</p>\';
    }

    echo $form;
}
}

add_action(\'widgets_init\', create_function(\'\', \'return register_widget("imp_image_slider");\'));

?>

结束
标签： plugin-development   widgets   options   小码农  

相关推荐

Upload images - Theme options

我正在使用这个很棒的[图坦卡门+教程][1]创建主题选项页面。这对我来说很好，因为我需要通过css更改div的背景图像。它可以很好地与一个图像，但我不知道如何使它与2个图像？如果你能告诉我我做错了什么，那将是一个巨大的帮助？谢谢 <?php function wptuts_get_default_options() { $options = array(); $options[] = array(\'logo\' => \'\');