Question

我只是使用Ajax方法的Codeigniter的新手。好吧，我有一个表格，用户需要填写所有字段，因为这是必需的。如果该字段为空，我已经完成了错误消息。如果数据有效或无效，我将通过控制器从JSON获得响应。现在我的问题是，如果数据已发送到数据库，如何显示通知？顺便说一句，正在发送数据。

表格

<form action="<?=base_url();?>execute/insert" id="formAddContent" autocomplete="off" class="nobottommargin" method="POST">
    <div class="row">
        <div class="col-md-6">
             <div class="form-group">
                  <label for="">Title <small>*</small></label>
                  <input type="text" name="content_title" id="content_title" class="sm-form-control">
             </div>
        </div>
        <div class="col-md-6">
            <div class="form-group">
                <label for="">Type <small>*</small></label>
                   <select name="content_type" id="content_type" class="sm-form-control">
                       <option value="">Type</option>
                       <option value="try">Try</option>
                   </select>
            </div>
         </div>
         <div class="col-md-12">
             <div class="form-group">
                 <label for="">Description <small>*</small></label>
                 <textarea class="required sm-form-control" id="content_body" name="content_body" rows="6" cols="30" required></textarea>
             </div>
         </div>
         <div class="col-md-3 margintop-sm">
             <button type="submit" class="btn btn-danger" id="data-content--submit">Submit</button>
         </div>
     </div>
</form>

控制器

public function validate($name, $label, $check) {
    return $this->form_validation->set_rules($name, $label, $check);
}

public function insert() {
    $data = array('success' => false, 'messages' => array());

    $name        = array('content_title','content_type','content_body');
    $label       = array('Title', 'Type', 'Content');
    $verify      = 'trim|required';
    $this->validate($name[0], $label[0], $verify);
    $this->validate($name[1], $label[1], $verify);
    $this->validate($name[2], $label[2], $verify);
    $this->form_validation->set_error_delimiters('<p class="text-danger">', '</p>');

    if($this->form_validation->run()) {
         $data['success'] = true;
    } else {
         foreach($_POST as $key => $value) {
            $data['messages'][$key] = form_error($key);
         }
    }
    echo json_encode($data);

    $data = array (
        $name[0] => $this->pass($name[0]),
        $name[1] => $this->pass($name[1]),
        $name[2] => $this->pass($name[2])
    );

    $result = $this->model->CreateContent($data);

    if($result) {
        redirect('master/content','refresh');
    }
}

模型

public function CreateContent($data) {
    $check = $this->db->select('content_title')->from('tblposts')->where(array('content_title' => $data['content_title']))->get();
    if($check->num_rows() > 0) {
        $this->notify([true,'#336699','#fff', 'Title already exists.']);
        return $check;
    } else {
        $result = $this->db->insert('tblposts', $data);
        $this->notify([true,'#336699','#fff', 'New content has been added.']);
        return $result;
    }
}

public function notify($data) {
    echo json_encode(['success'=>$data[0],'bgcolor'=>$data[1],'color'=>$data[2],'message'=>$data[3]]);
}

jQuery-AJAX

$('#formAddContent').submit(function(e) {
    e.preventDefault();
    var data = {
        content_title: $('#content_title').val(),
        content_type: $('#content_type').val(), 
        content_body: $('#content_body').val()
    };

    var url = $(this).attr('action');

    $.ajax({
        type: 'POST', url: url, data: data, cache: false, dataType: 'json',
        success:function(data) {
            if(data.success == true) {
                successful(data.success,data.bgcolor,data.color,data.message);
            } else {
                $.each(data.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);
                });
            }
        }
    });
});

//Custom method if the request was success. 
function successful(data,bgcolor,color,message) {
    data == true ? notify(bgcolor,color,message) : notify(bgcolor,color,message);
}

//Amaran Notification
function notify(bgcolor,color,message) {
    $.amaran({
        'theme'     : 'colorful', 'content'   : {bgcolor: bgcolor,color: color,message: message},
        'position'  : 'top right', 'outEffect' : 'slideBottom'
    });
}

JSON返回数组

{"success":true,"messages":[]}{"success":true,"bgcolor":"#336699","color":"#fff","message":"New content has been added."}

Answer 1

首先删除此部分：

if($result) {
        redirect('master/content','refresh');
    }

这将不重定向任何内容，但ajax请求（不是页面提交请求）（99％的时间不是期望的行为）将阻止成功呈现json数组，这意味着您应该出现控制台错误。如果您需要重定向，请在成功函数中通过js进行。如果您对此说明感到困惑，则js是客户端，而php是服务器端。

一旦删除了此内容（您的其余代码看起来都不错），页面应呈现成功消息，但不会重定向。如果选择在successful(data.success,data.bgcolor,data.color,data.message);之后添加js重定向功能，则可能永远看不到该消息。在这种情况下，如果需要100％重定向，则应在控制器代码中添加一条Flash消息，然后以js重定向，而不要使用successful()。然后，如果将您的下一页配置为查看Flash消息，它将显示在此处。

更新：

if ($this->form_validation->run()) {
    $data['success'] = true;
} else {
    foreach ($_POST as $key => $value) {
        $data['messages'][$key] = form_error($key);
    }
    // this should be here!
    echo json_encode($data);
    exit; // otherwise create content will trigger even on failed fv!
}

$data = array(
    $name[0] => $this->pass($name[0]),
    $name[1] => $this->pass($name[1]),
    $name[2] => $this->pass($name[2])
);

通知是否已发送数据

1 个答案: