带有单选按钮的Wordpress自定义小部件

时间:2018-05-04 23:06:22

标签: wordpress widget

我正在开发一个自定义wordpress小部件,其中包含由单选按钮组成的管理小部件选项。

单选按钮应该都具有相同的组,因此只能选择一个选项。

到目前为止,我有以下代码,根据需要显示单选按钮,但我不确定如何保存选择哪个单选按钮到数据库。

任何带示例的建议都会非常有用

由于

class example Widget extends WP_Widget {
// Set up the widget name and description.
 public function __construct() {
 $widget_options = array( 'classname' => 'widget', 'description' => 'widget 
 example' );
parent::__construct( '......', '.....', $widget_options );
}
// Create the widget output.
public function widget( $args, $instance ) {
extract( $args );
// Radio buttons
$premium_jobs = $instance[ 'premium_jobs' ];
$featured_jobs = $instance[ 'featured_jobs' ];
$prem_feat_jobs = $instance[ 'prem_feat_jobs' ];

echo $before_widget; ?>
/*  widget content here */
echo $after_widget;
}
 /**
 * Back-end widget form.
 *
 * @see WP_Widget::form()
 * 
 * @param array $instance Previously saved values from database.
 */
 public function form( $instance ) { ?>
    <input name="job" type="radio" value="premium" <?php checked( 'premium', 
 get_option( 'premium_jobs' ) ); ?> id="<?php echo $this->get_field_id( 
 'premium_jobs' ); ?>" > 
    <label for="<?php echo esc_attr( $this->get_field_id( 'premium_jobs' ) 
  ); ?>"><?php esc_attr_e( 'Premium Jobs Only', 'text_domain' ); ?></label> 
  </p>

  <p>
    <input name="job" type="radio" value="featured" <?php checked( 
  'featured_jobs', get_option( 'featured' ) ); ?> id="<?php echo $this- 
   >get_field_id( 'featured_jobs' ); ?>" > 
    <label for="<?php echo esc_attr( $this->get_field_id( 'featured_jobs' ) 
   ); ?>"><?php esc_attr_e( 'Featured Jobs Only', 'text_domain' ); ?> 
   </label> 
  </p>
  <p>
    <input name="job" type="radio" value="prem_feat" <?php checked( 
  'prem_feat_jobs', get_option( 'premfeat' ) ); ?> id="<?php echo $this- 
   >get_field_id( 'prem_feat_jobs' ); ?>" > 
    <label for="<?php echo esc_attr( $this->get_field_id( 'prem_feat_jobs' ) 
    ); ?>"><?php esc_attr_e( 'Premium & Featured Jobs', 'text_domain' ); ?> 
  </label> 
  </p>
<?php }

/**
 * Sanitize widget form values as they are saved.
 *
 * @see WP_Widget::update()
 *
 * @param array $new_instance Values just sent to be saved.
 * @param array $old_instance Previously saved values from database.
 *
 * @return array Updated safe values to be saved.
 */
public function update( $new_instance, $old_instance ) {
  $instance = array();
 // not sure what goes here

  return $instance;
  }
  }    

  function premium_job_listings_widget() { 
  register_widget( 'premium_job_Widget' );
  }
  add_action( 'widgets_init', 'premium_job_listings_widget' );

1 个答案:

答案 0 :(得分:0)

您的代码存在一些问题,首先清理它。未来你绝对会感谢现在你保持一贯清洁/正确缩进的代码,相信我 - 我仍然为我过去的错误付出代价!它看起来像你的复制/粘贴有点乱。

首先,您需要一个更好的类名,您可以在注册时调用它,并且可以清理构造函数。

其次,您可以extract( $instance )在前端定义变量。

第三,您的复选框未正确编码。每个name应该是相同的(它应该是widget类的字段名方法),只有value应该是不同的,并且你运行检查当前值的复选框。

第四,手头的主要问题是,您需要在保存时定义新实例,或者如果在更新功能中清空了实例,则将其取消。

第五,与第一点相关联,您将使用您在开头定义的相同类名注册您的小部件。因此,让我们将所有这些付诸实践:

class Premium_Job_Listings_Widget extends WP_Widget {
    // Initialize Widget with Options
    public function __construct() {
        parent::__construct(
            'premium_job_listings_widget',
            'Premium Job Listings Widget',
            array(
                'classname'   => 'premium-job-listings-widget',
                'description' => 'List Premium Jobs in a Widget'
            )
        );
    }

    // Widget Front End
    public function widget( $args, $instance ) {
        extract( $args );
        extract( $instance );

        echo $before_widget;
        /* Widget Content Below */
            echo "You picked [$job]"; //This will ouput "You picked [prem_feat]", etc.
        /* Widget Content Above */
        echo $after_widget;
    }

    // Widget Admin Form
    public function form( $instance ) { ?>
        <?php extract( $instance ); ?>
        <p>
            <label>
                <input type="radio" value="premium" name="<?php echo $this->get_field_name( 'job' ); ?>" <?php checked( $job, 'premium' ); ?> id="<?php echo $this->get_field_id( 'job' ); ?>" />
                <?php esc_attr_e( 'Premium Jobs Only', 'text_domain' ); ?>
            </label>
        </p>
        <p>
            <label>
                <input type="radio" value="featured" name="<?php echo $this->get_field_name( 'job' ); ?>" <?php checked( $job, 'featured' ); ?> id="<?php echo $this->get_field_id( 'jos' ); ?>" />
                <?php esc_attr_e( 'Featured Jobs Only', 'text_domain' ); ?>
            </label>
        </p>
        <p>
            <label>
                <input type="radio" value="prem_feat" name="<?php echo $this->get_field_name( 'job' ); ?>" <?php checked( $job, 'prem_feat' ); ?> id="<?php echo $this->get_field_id( 'jos' ); ?>" />
                <?php esc_attr_e( 'Premium & Featured Jobs', 'text_domain' ); ?>
            </label>
        </p>
    <?php }

    // Sanitize and Save Options
    public function update( $new_instance, $old_instance ) {
        extract( $new_instance );
        $instance = array();

        $instance['job'] = ( !empty( $job ) ) ? sanitize_text_field( $job ) : null;

        return $instance;
    }
}

function premium_job_listings_widget() {
    register_widget( 'Premium_Job_Listings_Widget' );
}
add_action( 'widgets_init', 'premium_job_listings_widget' );

上面的代码会在admin中为您提供一个看起来像这样的小部件:

Admin Form of the Widget

在前端就像这样:

enter image description here