form validation with ajax and codeigniter

Question

i want to use form validation library in ci on html popup and show errors to client when client request if validation error == True update row in database and if validation error = False show field error to client

my html popup code :

<div class="row">
    <div class="form-group col-lg-6">
        <label class="col-sm-4 control-label">tarh</label>
        <div class="col-sm-8 control-label">
            <input type="text" name="modal_tarh" id="modal_tarh" class="form-control">
        </div>
    </div>

    <div class="form-group col-lg-6">
        <label class="col-sm-3 control-label">agreement number</label>
        <div class="col-sm-6 control-label">
            <input type="text" name="modal_agreement_number" id="modal_agreement_number" class="form-control">
        </div>
    </div>
</div>
<button type="button" class="btn btn-info" id="edit_agreement">edit</button>

ajax code :

$(document).ready(function() {

    $("#edit_agreement").click(function () {
        var String_Url = "address";
        var String_Method = "POST";
        data_send = {

            'f1':$("#modal_tarh").val(),
            'f2':$("#modal_agreement_number").val()
        };
        $.ajax({
            url:String_Url,
            type:String_Method,
            data:data_send,
            contentType: 'application/json',
            success:function(callbackData, status, xhr){
                alert(callbackData)
                console.log(callbackData)

            },
            error:function(xhr, status, err){

                alert(xhr.status);
            }
        });
    });

});

codeigniter controller

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

class Portal extends My_controller
{

public function editAgreement()
    {
        $this->load->library('form_validation');

        $config = array(
            array(
                'field'   => 'modal_tarh',
                'label'   => 'tarh',
                'rules'   => 'required',
                'errors' => array
                (
                    'required' => 'pls fill %s  .',
                )
            ),
            array(
                'field'   => 'modal_agreement_number',
                'label'   => 'agreement number',
                'rules'   => 'required',
                'errors' => array
                (
                    'required' => 'pls fill %s  .',
                )
            )
        );

        $this->form_validation->set_rules($config);

        if ($this->form_validation->run() == FALSE)
        {
            echo validation_errors();
        }
        else
        {
            redirect('admin/portal/');
        }
    }
}

callbackData in ajax Contains http status code 200 and No data

Answer 1

You can't do a redirect like that via an ajax call.

Change

redirect('admin/portal/');

to

echo 'Success';

Or, if you really want to redirect the ajax request on success then do

echo base_url('admin/portal/');

and in your ajax request:

success:function(callbackData, status, xhr){
    window.location = callbackData;
},

You could also look at making your controller handle both ajax and non-ajax requests like so:

if ($this->input->is_ajax_request()) {
    echo base_url('admin/portal/');
} else {
    redirect('admin/portal/');
}