在ExpressionEngine中用CodeIgniter原生替代HTML实现日期输入

嘿，我来给你几个适配ExpressionEngine+CodeIgniter环境的日期输入解决方案，帮你搞定表单里的日期选择问题：

方案1：用HTML5原生日期控件配合CodeIgniter的form_input #

其实CodeIgniter的form_input完全可以生成HTML5的日期输入框，只需要指定type属性就行，浏览器会自带原生日期选择器，不用额外依赖，非常省心。

控制器代码调整： #

// 生成HTML5日期输入框，同时用set_value保留提交后的输入值，提升用户体验
$data['cycle_begin'] = form_input(array(
    'name' => 'cycle_begin',
    'type' => 'date',
    'value' => set_value('cycle_begin')
));

// 如果是月份选择，用HTML5的month类型更合适，返回YYYY-MM格式
$data['cycle_month'] = form_input(array(
    'name' => 'cycle_month',
    'type' => 'month',
    'value' => set_value('cycle_month')
));

if(isset($_POST['submit'])) {
    // 建议加上CodeIgniter表单验证，避免无效数据插入数据库
    ee()->load->library('form_validation');
    ee()->form_validation->set_rules('cycle_begin', 'Cycle Begin Date', 'required|valid_date');
    ee()->form_validation->set_rules('cycle_month', 'Cycle Month', 'required|regex_match[/^\d{4}-\d{2}$/]');

    if(ee()->form_validation->run()) {
        // 尽量用ee()->input->post()替代直接访问$_POST，更安全
        ee()->db->insert('exp_credit_tracker_assoc', array(
            'cycle_begin' => ee()->input->post('cycle_begin'),
            'cycle_months' => ee()->input->post('cycle_month')
        ));
        // 这里可以加插入成功后的提示或跳转逻辑
    }
}

视图代码示例： #

<div class="form-field">
    <label for="cycle_begin">Cycle Begin Date</label>
    <?php echo $cycle_begin; ?>
    <!-- 显示验证错误提示 -->
    <?php echo form_error('cycle_begin'); ?>
</div>

<div class="form-field">
    <label for="cycle_month">Cycle Month</label>
    <?php echo $cycle_month; ?>
    <?php echo form_error('cycle_month'); ?>
</div>

<button type="submit" name="submit">Save</button>

注意：HTML5原生控件在现代浏览器里表现很好，但如果需要兼容IE这类旧浏览器，建议看方案2。

方案2：集成第三方日期选择器（比如Flatpickr） #

如果想要更统一的样式、更强的自定义能力，或者兼容旧浏览器，轻量的JS日期选择器是不错的选择，比如Flatpickr（无依赖，体积小）。

步骤： #

1. 下载Flatpickr的CSS和JS文件，放到ExpressionEngine的assets目录（比如assets/css/和assets/js/）
2. 控制器里生成普通文本输入框，加个类名方便JS定位：

$data['cycle_begin'] = form_input(array(
    'name' => 'cycle_begin',
    'class' => 'date-picker',
    'value' => set_value('cycle_begin')
));

$data['cycle_month'] = form_input(array(
    'name' => 'cycle_month',
    'class' => 'month-picker',
    'value' => set_value('cycle_month')
));

3. 视图里引入资源并初始化：

<!-- 引入Flatpickr样式和脚本 -->
<link rel="stylesheet" href="{asset_url}flatpickr.min.css">
<script src="{asset_url}flatpickr.min.js"></script>

<div class="form-field">
    <label for="cycle_begin">Cycle Begin Date</label>
    <?php echo $cycle_begin; ?>
</div>

<div class="form-field">
    <label for="cycle_month">Cycle Month</label>
    <?php echo $cycle_month; ?>
</div>

<script>
// 初始化日期选择器，指定输出格式和数据库匹配
flatpickr(".date-picker", {
    dateFormat: "Y-m-d",
    minDate: "today" // 可选，限制不能选择今天之前的日期
});

// 初始化月份选择器
flatpickr(".month-picker", {
    dateFormat: "Y-m",
    mode: "month" // 只显示月份选择
});
</script>

方案3：自定义CodeIgniter表单辅助函数 #

如果你的项目里经常需要日期输入，可以扩展CodeIgniter的form_helper，封装成专属的日期输入函数，用起来更顺手。

1. 在application/helpers/目录创建MY_form_helper.php（ExpressionEngine会自动加载自定义辅助函数）：

<?php
if (!defined('BASEPATH')) exit('No direct script access allowed');

function form_date($data = '', $value = '', $extra = '') {
    $defaults = array(
        'type' => 'date',
        'name' => is_array($data) ? '' : $data,
        'value' => $value
    );
    return form_input($data, $value, $extra);
}

function form_month($data = '', $value = '', $extra = '') {
    $defaults = array(
        'type' => 'month',
        'name' => is_array($data) ? '' : $data,
        'value' => $value
    );
    return form_input($data, $value, $extra);
}

2. 控制器里直接调用自定义函数：

$data['cycle_begin'] = form_date('cycle_begin', set_value('cycle_begin'));
$data['cycle_month'] = form_month('cycle_month', set_value('cycle_month'));

额外提醒： #

• 数据库字段类型：确保cycle_begin字段是DATE类型，cycle_months可以用CHAR(7)或者DATE类型（存YYYY-MM格式）
• 表单验证：如果CodeIgniter默认的valid_date规则不够用，可以自定义验证规则来检查日期合法性
• 安全：始终用ee()->input->post()获取表单数据，避免直接使用$_POST，防止XSS攻击

内容的提问来源于stack exchange，提问作者user6818018