创建WordPress后台选项界面（二）—— 保存数据

在在创建WordPress后台选项界面（一）一文中，我们为CC Comments plugin创建了一个后台选项界面，界面里除了标题和描述外没有其它信息。本文将描述如何添加表单并保存数据到WordPress数据库。

在WordPress数据库中保存数据，有两种方式：

1. 创建自定义数据表
2. 保存到wp_options表中

本文使用第二种方法，这也是比较常用的方法。如果你的数据不太复杂，没有特殊要求，完全可以使用wp_options表来存储。

Step 1. 在后台管理界面创建表单

在在第一节中用来创建选项界面HTML结构的函数cccomm_option_page()中加入表单代码

function cccomm_option_page() {
	?>
	<div class="wrap">
		<?php screen_icon(); ?>
		<h2>CC Comments Options </h2>
		<p>Welcome to CC Comments plugin, here you can edit the email(s) to CC your comments to. </p>
		<form action="" method="post" id="cc-comments-email-options-form">
			<h3><label for="cc_email"></label>Email to send CC to:
			<input type="text" name="cc_email" id="cc_email" 
			value="<?php echo esc_attr(get_option('cccomm_cc_email')) ?>" size="40" /></h3>
			<p><input type="submit" name="submit" value="Save Email" /></p>
			<?php wp_nonce_field('cccomm_admin_options-update'); ?>
		</form>
	</div>
	<?php
}

1. 表单的acton为空，意思是提交到本页面
2. 用户要填写的字段name为cc_email，用来存储要抄送的邮箱地址
3. get_option()用来获取wp_options表中的数据，只需要告诉它要获取的字段的option_name是什么，它就会返回option_value，这里option_name为cccomm_cc_email
4. 特别注意wp_nonce_field这个函数，在php中判断表单提交，通常的做法是创建一个hidden field，在数据处理函数中验证$_POST[‘hidden field name’]是否存在。这种做法虽然可以但并不安全，wp_nonce_field函数则可以进行安全验证

刷新页面效果如下

Step 2. 存储数据到wp_options表中

因为数据被提交到当前页面，所以我们可以在cccomm_option_page()函数中完成数据存储

function cccomm_option_page() {
    if( !empty($_POST) && check_admin_referer('cccomm_admin_options-update') ) {
        update_option('cccomm_cc_email', $_POST['cc_email']);
        ?>
        <div id="message" class="updated">
            <p><strong>Email was saved for CC Comments</strong></p>
        </div>
        <?php
    }
    
    ?>
    <div class="wrap">
        <?php screen_icon(); ?>
       ...
    <?php
}

1. 在检测是否有数据提交时，使用了check_admin_referer()函数，参数就是wp_nonce_field()函数中定义的key
2. 验证通过，就调用update_option()函数存储数据。update_option()先检测option_name是否存在，如果不存在则创建，存在则更新。add_option()更适合用在插件启用时存储数据的情景。
3. 我们还要向用户展示一条消息，告知email已经成功保存，使用WordPress预定义结构包含我们的消息，id可以随意更换。

   <div id="message" class="updated"></div>

提交后的效果如下

这种保存数据的方法不是唯一的，将数据存储到wp_options表中可以使用Settings API来实现，更加简单安全。不过要向自定义数据表中存储数据，这种做法还是很有用的。

示例代码下载

[download id=39]

继续阅读：创建WordPress后台选项界面（三）—— 使用Settings API存取数据