CodeIgniter中AJAX更新SQL数据时验证提示不显示且无法保存

看起来你在使用CodeIgniter开发AJAX表单时遇到了两个典型问题，我来帮你一步步排查解决：

问题1：必填字段未显示“此字段为必填项”的验证提示 #

这个问题主要是验证规则不完整和视图错误提示未正确关联导致的：

修复步骤： #

1. 补全控制器的表单验证规则
   在update_battery_form_validation方法中，给所有需要必填的字段添加required规则，确保每个需要验证的字段都能触发错误提示：

function update_battery_form_validation() {
    $data = array('success' => false, 'messages' => array());
    $this->load->library('form_validation');
    
    // 为所有必填字段添加验证规则
    $this->form_validation->set_rules('PONumber','PO Number','required');
    $this->form_validation->set_rules('ticketid','Ticket ID','required');
    $this->form_validation->set_rules('select_port','Data Port','required');
    $this->form_validation->set_rules('ups_asset_tag','UPS Asset Tag','required');
    $this->form_validation->set_rules('date_installed','Date Installed','required');
    $this->form_validation->set_rules('select_status','Status','required');
    
    // ... 后续逻辑保持不变
}

2. 完善视图的错误提示输出
   确保每个需要验证的字段都正确输出form_error，比如：

• UPS Asset Tag字段：

<div class="form-group">
    <label>UPS Asset Tag</label>
    <input type="text" name="ups_asset_tag" value="<?php echo $row->UPS_AssetTag; ?>" class="form-control" />
    <span class="text-danger"><?php echo form_error("ups_asset_tag"); ?></span>
</div>

• Date Installed字段：

<div class="form-group">
    <label>Date Installed</label>
    <input type="date" name="date_installed" value="<?php echo $row->DateInstalled; ?>" class="form-control" />
    <span class="text-danger"><?php echo form_error("date_installed"); ?></span>
</div>

• Status下拉框（同时补全默认选项的value属性，避免提交空值）：

<div class="form-group">
    <label>Status</label>
    <select class="form-control" name="select_status">
        <option value="<?php echo $row->Status; ?>" selected><?php echo $row->Status; ?></option>
        <?php foreach($get_AssetStatus as $AssetStatus){?>
        <option value="<?php echo $AssetStatus['AssetStatus']; ?>"><?php echo $AssetStatus['AssetStatus']; ?></option>
        <?php } ?>
    </select>
    <span class="text-danger"><?php echo form_error("select_status"); ?></span>
</div>

问题2：填写完数据后页面无跳转且数据未保存 #

这个问题的核心是AJAX异步请求与服务器端跳转的冲突，以及表单控件冗余：

修复步骤： #

1. 移除冗余的Submit按钮
   视图里有两个功能重复的Submit按钮（name分别为update和insert），会导致服务器端参数判断混乱，只保留一个即可：

<div class="form-group">
    <input type="hidden" name="hidden_id" value="<?php echo $row->ID; ?>" />
    <input type="submit" name="update" id="update" value="Update" class="btn btn-info" />
    <!-- 移除下面这个重复按钮 -->
    <!-- <input type="submit" name="insert" id="insert" value="Update" class="btn btn-primary"> -->
</div>

2. 修改AJAX成功回调，手动处理页面跳转
   因为AJAX阻止了表单的默认提交行为，服务器端的redirect()不会生效，需要在前端手动实现跳转：

$('#form-battery-update').submit(function(e) {
    e.preventDefault();
    var me = $(this);
    $.ajax({
        url: '<?php echo base_url(); ?>msasset/update_battery_form_validation',
        type: 'post',
        data: me.serialize(),
        dataType: 'json',
        success: function(response) {
            if (response.success == true) {
                $('#the-message').append('<div class="alert alert-success">' +
                    '<span class="glyphicon glyphicon-ok"></span>' +
                    ' UPS Battery has been updated' + // 把提示改成更新成功
                    '</div>');
                $('.form-group').removeClass('has-error')
                    .removeClass('has-success');
                $('.text-danger').remove();
                me[0].reset();
                
                // 延迟3秒后跳转到列表页面，和提示显示时间匹配
                setTimeout(function(){
                    window.location.href = '<?php echo base_url(); ?>msasset/ups_batteries';
                }, 3000);
            } else {
                $.each(response.messages, function(key, value) {
                    var element = $('#' + key);
                    element.closest('div.form-group')
                        .removeClass('has-error')
                        .addClass(value.length > 0 ? 'has-error' : 'has-success')
                        .find('.text-danger')
                        .remove();
                    element.after(value);
                });
            }
        }
    });
});

3. 调整控制器逻辑，移除服务器端跳转
   既然前端已经处理了跳转，控制器里的redirect()可以删掉，同时确保更新成功后把success设为true：

if($this->form_validation->run() == TRUE) {
    $this->load->model('assets_model');
    $data = array(
        'PONumber' => $this->input->post('PONumber'),
        'TicketNumber' => $this->input->post('ticketid'),
        'DataPort' => $this->input->post('select_port'),
        'UPS_AssetTag' => $this->input->post('ups_asset_tag'),
        'DateInstalled' => $this->input->post('date_installed'),
        'Status' => $this->input->post('select_status'),
        'PerformedBy' => $this->session->userdata('user_name')
    );
    if($this->input->post('update')) {
        $this->assets_model->update_battery($data,$this->input->post('hidden_id'));
        $this->session->set_flashdata('batteries_updated','UPS Battery has been updated successfully');
        // 移除服务器端跳转
        // redirect('msasset/ups_batteries');
        $data['success'] = true; // 确保返回success状态为true
    }
}

最后，别忘了检查你的assets_model里的update_battery方法是否正确执行了数据库更新操作，示例如下：

public function update_battery($data, $id) {
    $this->db->where('ID', $id);
    return $this->db->update('your_battery_table_name', $data);
}

替换your_battery_table_name为实际的数据库表名即可。

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