php - 创建具有多个textarea的wordpress小部件(Create a wordpress widget with multiple textarea)

Question

class ad_widget extends WP_Widget {
function __construct() {
    $widget_ops = array( 'classname' => 'ad-widget-container', 'description' => __( ' Ad WIDGET' ) );
    parent::__construct( 'ad-widget', __( 'Ad widget', 'test' ), $widget_ops );
}
function widget( $args, $instance ) {
    extract( $args, EXTR_SKIP );
    $title = empty( $instance['title'] ) ? '' : apply_filters( 'widget_title', $instance['title'] );
    $text = empty( $instance['text'] ) ? '' : apply_filters( 'widget_text', $instance['text'] );
    echo $args['before_widget'];
    if ( $title )
        echo $args['before_title'] . $title . $args['after_title'];

    echo '<div class="cutom-widget">';
       echo $text;
    echo '</div>';
    echo $args['after_widget'];
}
function update( $new_instance, $old_instance ) {
    $instance = $old_instance;
    $instance['title'] = strip_tags($new_instance['title']);
    $instance['text'] =  $new_instance['text'];
    return $instance;
}    
function form( $instance ) {
    $instance = wp_parse_args( (array) $instance, array( 'title' => '' ) );
    $title = esc_attr( $instance['title'] ); 
    $text = esc_textarea($instance['text']); ?>
    <p>
       <label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:', 'test' ); ?></label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo $title; ?>" />
        <textarea class="widefat" rows="16" cols="20" id="<?php echo $this->get_field_id('text'); ?>" name="<?php echo $this->get_field_name('text'); ?>"><?php echo $text; ?></textarea>
    *<a>Add more text area</a>
    <a>delete text area </a>*
    </p><?php
}

} This is a simple widget with a text-box and text-area.I need something like when i click on "add more text area" it adds a textarea with different id's and saves different values.

(这是一个带有文本框和文本区域的简单小部件。我需要类似的操作，例如当我单击“添加更多文本区域”时，它会添加具有不同ID的文本区域并保存不同的值。)

  ask by Sneha Grewal translate from so

Answer 1

I guess you have to use JS to do it.

(我想您必须使用JS来做到这一点。)

1. Place or append a button on last textarea

   (在最后一个文本区域上放置或添加按钮)

2. On click the button would add another textarea with appropriate markup

   (点击该按钮将添加另一个带有适当标记的文本区域)

3. Grab that value and append on the widget form

   (获取该值并附加到小部件表单上)