CRUD With Client-Side Validation | Codeigniter

Form.php        Controller
<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Form extends CI_Controller {

function __construct()
{
parent:: __construct();
$this->load->model('form_model');
}

public function index()
{
$data['formdatas'] = $this->form_model->get_form_data();
$this->load->view('include/header');
$this->load->view('form/list',$data);
$this->load->view('include/footer');
}

public function create()
    {
        $this->load->view('include/header');
        $this->load->view('form/create');
        $this->load->view('include/footer');
    }

    public function submitform()
    {
        if (!empty($this->input->post())) {

            if (isset($_FILES['singleFile']) && (!empty($_FILES['singleFile']['name']))) {
                $Filename = $_FILES['singleFile']['name'];
                $singleFile = $this->single_file_upload($Filename, 'assets/uploads/', 'singleFile');
            }else{
                $singleFile = "";
            }

            if (isset($_FILES['multiplefile']) && (!empty($_FILES['multiplefile']['name']))) {
                //$multi_Filename = $_FILES['multiplefile']['name'];
                $multiplefile = $this->mumtiple_file_upload('multiplefile', 'assets/uploads/');
            }else{
                $multiplefile = "";
            }

            $inputData = array(
                'text'          => $this->input->post('text'),
                'dropdown'      => $this->input->post('dropdown'),
                'radio'         => $this->input->post('radio'),
                'checkbox'      => $this->input->post('selectcheckboxval'),
                'singleFile'    => $singleFile,
                'multiplefile'  => $multiplefile,
                'status'        => 1,
                'cdate'         => date('Y-m-d H:i:s'),
            );

            $inserted = $this->form_model->insert_data($inputData);

            if($inserted){
                $status = "Success";
                $message = "Record inserted.";
                $data = array("Common" => array("Title" => "Form submit API", 'version' => '1.0', 'Description' => 'Form submit API', 'Method' => 'POST', 'Status' => $status, 'Message' => $message), "Response" => array("formdata" => $inputData));
                print(json_encode($data, JSON_UNESCAPED_UNICODE));
            }else{
                $status = "Fail";
                $message = "Record not inserted.";
                $data = array("Common" => array("Title" => "Form submit API", 'version' => '1.0', 'Description' => 'Form submit API', 'Method' => 'POST', 'Status' => $status, 'Message' => $message), "Response" => array("Value" => 'Record not inserted'));
                print(json_encode($data, JSON_UNESCAPED_UNICODE));
            }
        } else {
            $status = "Fail";
            $message = "Invalid request.";
            $data = array("Common" => array("Title" => "Form submit API", 'version' => '1.0', 'Description' => 'Form submit API', 'Method' => 'POST', 'Status' => $status, 'Message' => $message), "Response" => array("Value" => 'Invalid request'));
            print(json_encode($data, JSON_UNESCAPED_UNICODE));
        }
    }

    public function edit_form($id)
    {
        $data['formdata'] = $this->form_model->get_edit_form_data($id);
        $this->load->view('include/header');
        $this->load->view('form/edit',$data);
        $this->load->view('include/footer');
    }

    public function updateform()
    {
        if (!empty($this->input->post())) {

            $id = $this->input->post('id');

            if (isset($_FILES['singleFile']) && (!empty($_FILES['singleFile']['name']))) {
                $Filename = $_FILES['singleFile']['name'];
                $singleFile = $this->single_file_upload($Filename, 'assets/uploads/', 'singleFile');
            }else{
                $singleFile = $this->form_model->get_single_file($id);
            }

            if (isset($_FILES['multiplefile']) && (!empty($_FILES['multiplefile']['name']))) {
                //$multi_Filename = $_FILES['multiplefile']['name'];
                $multiplefile = $this->mumtiple_file_upload('multiplefile', 'assets/uploads/');
            }else{
                $multiplefile = $this->form_model->get_multiple_file($id);
            }

            $inputData = array(
                'text'          => $this->input->post('text'),
                'dropdown'      => $this->input->post('dropdown'),
                'radio'         => $this->input->post('radio'),
                'checkbox'      => $this->input->post('selectcheckboxval'),
                'singleFile'    => $singleFile,
                'multiplefile'  => $multiplefile,
                'udate'         => date('Y-m-d H:i:s')
            );

            $updated = $this->form_model->update_data($id,$inputData);

            if($updated){
                $status = "Success";
                $message = "Record updated.";
                $data = array("Common" => array("Title" => "Form update API", 'version' => '1.0', 'Description' => 'Form update API', 'Method' => 'POST', 'Status' => $status, 'Message' => $message), "Response" => array("formdata" => $inputData));
                print(json_encode($data, JSON_UNESCAPED_UNICODE));
            }else{
                $status = "Fail";
                $message = "Record not update.";
                $data = array("Common" => array("Title" => "Form update API", 'version' => '1.0', 'Description' => 'Form update API', 'Method' => 'POST', 'Status' => $status, 'Message' => $message), "Response" => array("Value" => 'Record not update'));
                print(json_encode($data, JSON_UNESCAPED_UNICODE));
            }
        } else {
            $status = "Fail";
            $message = "Invalid request.";
            $data = array("Common" => array("Title" => "Form update API", 'version' => '1.0', 'Description' => 'Form update API', 'Method' => 'POST', 'Status' => $status, 'Message' => $message), "Response" => array("Value" => 'Invalid request'));
            print(json_encode($data, JSON_UNESCAPED_UNICODE));
        }
    }

    public function delete($id)
    {
        $this->form_model->delete($id);
    }

    function single_file_upload($Filename, $path, $controlName)
    {
        $config['upload_path']   = $path;
        $config['file_name']     = $Filename;
        $config['allowed_types'] = '*';
        $config['max_size']      = '*';
        $config['max_width']     = '*';
        $config['max_height']    = '*';
        $config['encrypt_name']  = TRUE;
     
        $this->load->helper('file');
        $this->load->library('upload', $config);
        $this->upload->initialize($config);

        if ($this->upload->do_upload($controlName)) {

            $filedata = $this->upload->data();
            return $filedata['file_name'];

        } else {
            return FALSE;
        }
    }

    public function mumtiple_file_upload($multiplefile, $path)
    {

        $mul_file_data = [];

        $count = count($_FILES[$multiplefile]['name']);
 
        for($i=0;$i<$count;$i++){
 
            if(!empty($_FILES[$multiplefile]['name'][$i])){
     
                $_FILES['file']['name']   = $_FILES[$multiplefile]['name'][$i];
                $_FILES['file']['type']   = $_FILES[$multiplefile]['type'][$i];
                $_FILES['file']['tmp_name'] = $_FILES[$multiplefile]['tmp_name'][$i];
                $_FILES['file']['error']  = $_FILES[$multiplefile]['error'][$i];
                $_FILES['file']['size']   = $_FILES[$multiplefile]['size'][$i];

                $config['upload_path']   = $path;
                $config['file_name']     = $_FILES[$multiplefile]['name'][$i];
                $config['allowed_types'] = '*';
                $config['max_size']      = '*';
                $config['max_width']     = '*';
                $config['max_height']    = '*';
                $config['encrypt_name']  = TRUE;
   
                $this->load->helper('file');
                $this->load->library('upload', $config);
                $this->upload->initialize($config);
     
                if($this->upload->do_upload('file')){
                    $uploadData = $this->upload->data();
                    $filename = $uploadData['file_name'];
                    $mul_file_data[] = $filename;
                }
            }
        }
 
      return implode(',', $mul_file_data);

    }
}

Form_model.php     Model
<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Form_model extends CI_Model {

public function insert_data($formdata)
    {
        return $this->db->insert('tbl_form',$formdata);
    }

    public function get_form_data()
    {
        $this->db->select('*')
            ->from('tbl_form')
            ->order_by('id','DESC');
        $query = $this->db->get();
        if ($query->num_rows() > 0) {
            return $query->result_array();
        } else {
            return false;
        } 
    }

    public function delete($id)
    {
        $this->db->where('id', $id)
                 ->delete('tbl_form');
        return true;
    }

    public function get_edit_form_data($id)
    {
        $this->db->select('*')
                 ->where('id', $id);
        $query = $this->db->get('tbl_form');
        if ($query->num_rows() > 0) {
            return $query->row_array();
        } else {
            return false;
        }
    }

    public function get_single_file($id)
    {
        $this->db->select('*')
                 ->where('id', $id);
        $query = $this->db->get('tbl_form');
        if ($query->num_rows() > 0) {
            $singlefile = $query->row_array();
            return $singlefile['singleFile'];
        } else {
            return false;
        }
    }

    public function get_multiple_file($id)
    {
        $this->db->select('*')
                 ->where('id', $id);
        $query = $this->db->get('tbl_form');
        if ($query->num_rows() > 0) {
            $multiplefile = $query->row_array();
            return $multiplefile['multiplefile'];
        } else {
            return false;
        }
    }

    public function update_data($id,$inputData)
    {
        $this->db->where('id', $id);
        $this->db->update('tbl_form', $inputData);
        return true;

    }
}

list.php    view 

<div class="container-fluid text-center">
<div class="row">
    <a href="<?php echo base_url('form/create')?>" ><button class="btn btn-primary">Create</button></a>
</div>
  <div class="row content">
    <div class="col-sm-12 text-left">
      <table class="table table-striped table-bordered nowrap dataTable dt-responsive" style="width:100%">
          <thead>
            <tr>
                <th>IT's No</th>
                <th>Name</th>
                <th>Education</th>
                <th>Gender</th>
                <th>Hobby</th>
                <th>File</th>
                <th>Photos</th>
                <th>Action</th>
            </tr>
          </thead>
          <tbody>
            <?php if($formdatas){?>
                <?php foreach($formdatas as $key => $formdata){?>
                <tr>
                    <td><?php echo $key+1;?></td>
                    <td><?php echo $formdata['text'];?></td>
                    <td><?php echo $formdata['dropdown'];?></td>
                    <td><?php echo $formdata['radio'];?></td>
                    <td><?php echo $formdata['checkbox'];?></td>
                    <td>
                        <img src="<?php echo base_url('assets/uploads/'.$formdata['singleFile']);?>" height="50px" width="50px">
                    </td>
                    <td>
                        <?php $gallerys = explode(',', $formdata['multiplefile']);?>
                        <?php foreach($gallerys as $gallery){?>
                        <img src="<?php echo base_url('assets/uploads/'.$gallery);?>" height="50px" width="50px">
                        <?php }?>
                    </td>
                    <td>
                        <a href="<?php echo base_url('form/edit_form/'.$formdata['id']) ?>" >
                            <button class="btn btn-primary">Edit</button>
                        </a>
                        <button onclick="deletedata('<?php echo $formdata['id']?>')" class="btn btn-danger">Delete</button>
                    </td>
                </tr>
                <?php }?>
            <?php }?>
          </tbody>
        </table>
    </div>
  </div>
</div>


<script type="text/javascript">
    $(document).ready(function()
    {
        $('.table').DataTable({
        });
    })

    function deletedata(id){
        swal({
            title: "Are you sure?",
            text: "You will not be able to recover this Data.",
            type: "warning",
            showCancelButton: true,
            confirmButtonClass: "btn-danger",
            confirmButtonText: "Yes, delete!",
            cancelButtonText: "No",
            closeOnConfirm: false,
            closeOnCancel: false
        }, function (isConfirm) {
            if (isConfirm) {

                $.ajax({
                    url: "<?php echo base_url('form/delete/')?>" + id,
                    type: "POST",
                    success: function (data) {
                        swal({
                            title: 'Success!',
                            type: 'success',
                            focusConfirm: false,
                            timer: 2000,
                        });
                        window.setTimeout(function () {
                            location.reload();
                        }, 2000);
                    },
                    error: function () {
                        alert('Not Closed');
                    }
                });
            } else {
                swal("Cancelled", "Your Data is safe :)", "error");
            }
        });
    }
</script>

create.php    view

<style type="text/css">
.errorBlock {
        color: #FF0000;
        font-weight: normal;
        display: none;
        text-align: left;
        font-size: 12px;
    }
</style>

<div class="container-fluid text-center">
<div class="row">
   <h2> Create Form</h2>
</div> 
  <div class="row content">
    <div class="col-sm-12 text-left">
      <form method="POST" enctype="multipart/form-data" action=''>
<div class="row">
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="text" class="block">Name *</label>
</div>
<div class="col-sm-12">
<input type="text" id="text" name="text" class="form-control" value="<?php if(isset($formdata['text'])){ echo $formdata['text']; }?>">
<span class="errorBlock" id="errortext"></span>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="dropdown" class="block">Education *</label>
</div>
<div class="col-sm-12">
<select id="dropdown" name="dropdown" class="form-control">
<option value="">Select Option</option>
<option value="BE" <?php if(isset($formdata['dropdown'])){ echo "selected";} ?>>BE</option>
<option value="ME">ME</option>
<option value="Btech">Btech</option>
<option value="Mtech">Mtech</option>
</select>
<span class="errorBlock" id="errordropdown"></span>
</div>
</div>
</div>
</div>

<div class="row">
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="gender" class="block">Gender *</label>
</div>
<div class="col-sm-12">
<input type="radio" id="radio" name="gender" value="male" >Male
<input type="radio" id="radio" name="gender" value="female">Female
<span class="errorBlock" id="errorradio"></span>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="hobby" class="block">Hobby *</label>
</div>
<div class="col-sm-12">
<input type="checkbox" id="checkbox" name="hobby[]" value="cricket" >cricket
<input type="checkbox" id="checkbox" name="hobby[]" value="wb" >wb
<input type="checkbox" id="checkbox" name="hobby[]" value="fb" >fb
<span class="errorBlock" id="errorcheckbox"></span>
</div>
</div>
</div>
</div>

<div class="row">
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="file" class="block">File *</label>
</div>
<div class="col-sm-12">
<input type="file" id="singleFile" name="file" class="form-control">
<span class="errorBlock" id="errorsingleFile"></span>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="photos" class="block">Gallary *</label>
</div>
<div class="col-sm-12">
<input type="file" id="multiplefile" name="photos[]" multiple="" class="form-control">
<span class="errorBlock" id="errormultiplefile"></span>
</div>
</div>
</div>
</div>

<input type="btton" name="submit" value="submit" id="submitform" class="btn btn-info">
</form>
    </div>
  </div>
</div>

<script type="text/javascript">
$('#submitform').click(function(){
var valitated = formValidation();
if(valitated === true){
submitformdata();
}
});

    // Claim continue validation
    function formValidation(){
    /* start input fild validation */
    if ($('#text').val().length > 0) {
    var textRegex = /^[a-zA-Z-' ]+$/.test($('#text').val());
    if (textRegex === true) {
    $("#errortext").css("display", "none");
    } else {
    $("#errortext").css("display", "block");
    $('#errortext').html('Only characters are allowed.');
    }

    } else {
    $("#errortext").css("display", "block");
    $('#errortext').html('Name is required.');
    }

    /* start dropdown  validation */
    if ($('#dropdown').val().length > 0) {
    $("#errordropdown").css("display", "none");
    }else {
    $("#errordropdown").css("display", "block");
    $('#errordropdown').html('Education is required.');
    }

    /* start radio button validation */
    var radio = $('#radio:checked').val();
    if (radio =='male' || radio =='female') {
    $("#errorradio").css("display", "none");
    } else {
    $("#errorradio").css("display", "block");
    $('#errorradio').html('Gender is required.');
    }

    /* start checkbox button validation */
    var checkbox = [];
    $("#checkbox:checked").each(function() {
    checkbox.push($(this).val());
    });
   
    var selected;
    selected = checkbox.join(',') ;
   
    if(selected.length > 0){
    $("#errorcheckbox").css("display", "none");
    }else{
    $("#errorcheckbox").css("display", "block");
    $('#errorcheckbox').html('Choose at least one Hobby.');
    }

    /* start single file  validation */
    var fileName = $("#singleFile").val();
    if(fileName) {
    $("#errorsingleFile").css("display", "none");
    } else {
    $("#errorsingleFile").css("display", "block");
    $('#errorsingleFile').html('Choose Single File.');
    }

    /* start multiple file upload validation */
    if ($("#multiplefile").get(0).files.length > 0) {
    for (var i = 0; i < $("#multiplefile").get(0).files.length; ++i) {
    var multiplefile = $("#multiplefile").get(0).files[i].name;
    if(multiplefile){                     
    var file_size = $("#multiplefile").get(0).files[i].size;

    if(file_size<999999999){
    var ext = multiplefile.split('.').pop().toLowerCase();                         
    if($.inArray(ext,['jpg','jpeg','gif','png'])===-1){
    $("#errormultiplefile").css("display", "block");
    $('#errormultiplefile').html('Invalid file extension');
    }else{
    $("#errormultiplefile").css("display", "none");
    }

    }else{
    $("#errormultiplefile").css("display", "block");
    $('#errormultiplefile').html('size is too large.');
    }                     
    }else{
    $("#errormultiplefile").css("display", "block");
    $('#errormultiplefile').html('fill all fields..');
    }
    }
    }else{
    $("#errormultiplefile").css("display", "block");
    $('#errormultiplefile').html('Choose Multiple File.');
    }

    var nullCounter = $(".errorBlock:visible").length;
    if(nullCounter === 0){
    return true;
    }else{
    return false;
    }
    }

    function submitformdata()
    {
    var text = $('#text').val();
    var dropdown = $('#dropdown').val();
    var radio = $("input[name='gender']:checked").val();
   
    var checkboxval = [];
    $("#checkbox:checked").each(function() {
    checkboxval.push($(this).val());
    });
    var selectcheckboxval;
    selectcheckboxval = checkboxval.join(',') ;

    var dataValues = new FormData();
 
    dataValues.append('text', text);
    dataValues.append('dropdown', dropdown);
    dataValues.append('radio', radio);
    dataValues.append('selectcheckboxval', selectcheckboxval);
    dataValues.append('singleFile', $("#singleFile").get(0).files[0]);

    var totalfiles = $("#multiplefile").get(0).files.length;

    for (var index = 0; index < totalfiles; index++) {
    dataValues.append("multiplefile[]", $("#multiplefile").get(0).files[index]);
    }

    $.ajax({
    type: "POST",
    data: dataValues,
    contentType: false,
    cache: false,
    processData: false,
    dataType: "json",
    url: "<?php echo base_url('Form/submitform');?>",
    success: function (result) {
    var objToString = JSON.stringify(result);
    var stringToArray = [];
    stringToArray.push(objToString);
    var jsonObj = $.parseJSON(stringToArray);
    var message = jsonObj.Common.Message;
   
    if (message == "Record inserted.") {
    window.location.href = "<?php echo base_url('Form/index'); ?>";
    } else {
    swal("Wrong", "Something Wrong,try again.)", "error");
    }
    }
    });
}
</script>

edit.php      view

<style type="text/css">
.errorBlock {
        color: #FF0000;
        font-weight: normal;
        display: none;
        text-align: left;
        font-size: 12px;
    }
</style>

<div class="container-fluid text-center"> 
  <div class="row content">
    <div class="col-sm-12 text-left">
      <form method="POST" enctype="multipart/form-data" action=''>
<input type="hidden" name="id" id="id" value="<?php echo $formdata['id']?>">
<div class="row">
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="text" class="block">Name *</label>
</div>
<div class="col-sm-12">
<input type="text" id="text" name="text" class="form-control" value="<?php if(isset($formdata['text'])){ echo $formdata['text']; }?>">
<span class="errorBlock" id="errortext"></span>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="dropdown" class="block">Education *</label>
</div>
<div class="col-sm-12">
<select id="dropdown" name="dropdown" class="form-control">
<option value="">Select Option</option>
<option value="BE" <?php if($formdata['dropdown'] == 'BE'){ echo "selected";} ?>>BE</option>
<option value="ME" <?php if($formdata['dropdown'] == 'ME'){ echo "selected";} ?>>ME</option>
<option value="Btech" <?php if($formdata['dropdown'] == 'Btech'){ echo "selected";} ?>>Btech</option>
<option value="Mtech" <?php if($formdata['dropdown'] == 'Mtech'){ echo "selected";} ?>>Mtech</option>
</select>
<span class="errorBlock" id="errordropdown"></span>
</div>
</div>
</div>
</div>

<div class="row">
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="gender" class="block">Gender *</label>
</div>
<div class="col-sm-12">
<input type="radio" id="radio" name="gender" value="male" <?php if($formdata['radio'] == 'male'){ echo "checked";} ?> >Male
<input type="radio" id="radio" name="gender" value="female" <?php if($formdata['radio'] == 'female'){ echo "checked";} ?>>Female
<span class="errorBlock" id="errorradio"></span>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="hobby" class="block">Hobby *</label>
</div>
<div class="col-sm-12">
<?php
if(isset($formdata['checkbox'])){
$checkbox = explode(',', $formdata['checkbox']);
$cricket='';
$wb='';
$fb='';

foreach ($checkbox as $key => $hobbyvalue) {
if($hobbyvalue == 'cricket'){
$cricket= 'checked';
}

if($hobbyvalue == 'wb'){
$wb= 'checked';
}

if($hobbyvalue == 'fb'){
$fb= 'checked';
}
}?>

<?php } ?>

<input type="checkbox" id="checkbox" name="checkbox[]" value="cricket" <?php if(isset($cricket)){ echo $cricket;} ?>>cricket
<input type="checkbox" id="checkbox" name="checkbox[]" value="wb" <?php if(isset($wb)){ echo $wb;} ?> >wb
<input type="checkbox" id="checkbox" name="checkbox[]" value="fb" <?php if(isset($fb)){ echo $fb;} ?>>fb
<span class="errorBlock" id="errorcheckbox"></span>
</div>
</div>
<?php echo form_error('checkbox[]','<p class="text-danger error">','</p>'); ?>
</div>
</div>

<div class="row">
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="file" class="block">File *</label>
</div>
<div class="col-sm-12">
<input type="file" id="singleFile" name="file" class="form-control">
<img src="<?php echo base_url('assets/uploads/'.$formdata['singleFile']);?>" height="50px" width="50px">
<span class="errorBlock" id="errorsingleFile"></span>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<div class="col-sm-12">
<label for="photos" class="block">Gallary *</label>
</div>
<div class="col-sm-12">
<input type="file" id="multiplefile" name="photos[]" multiple="" class="form-control">
<?php $gallerys = explode(',', $formdata['multiplefile']);?>
                    <?php foreach($gallerys as $gallery){?>
                    <img src="<?php echo base_url('assets/uploads/'.$gallery);?>" height="50px" width="50px">
                    <?php }?>
<span class="errorBlock" id="errormultiplefile"></span>
</div>
</div>
</div>
</div>

<input type="btton" name="submit" value="submit" id="submitform" class="btn btn-info">
</form>
    </div>
  </div>
</div>

<script type="text/javascript">
$('#submitform').click(function(){
var valitated = formValidation();
if(valitated === true){
submitformdata();
}
});

    //  validation
    function formValidation(){
    /* start input fild validation */
    if ($('#text').val().length > 0) {
    var textRegex = /^[a-zA-Z-' ]+$/.test($('#text').val());
    if (textRegex === true) {
    $("#errortext").css("display", "none");
    } else {
    $("#errortext").css("display", "block");
    $('#errortext').html('Only characters are allowed.');
    }

    } else {
    $("#errortext").css("display", "block");
    $('#errortext').html('Name is required.');
    }

    /* start dropdown  validation */
    if ($('#dropdown').val().length > 0) {
    $("#errordropdown").css("display", "none");
    }else {
    $("#errordropdown").css("display", "block");
    $('#errordropdown').html('Education is required.');
    }

    /* start radio button validation */
    var radio = $('#radio:checked').val();
    if (radio =='male' || radio =='female') {
    $("#errorradio").css("display", "none");
    } else {
    $("#errorradio").css("display", "block");
    $('#errorradio').html('Gender is required.');
    }

    /* start checkbox button validation */
    var checkbox = [];
    $("#checkbox:checked").each(function() {
    checkbox.push($(this).val());
    });
   
    var selected;
    selected = checkbox.join(',') ;
   
    if(selected.length > 0){
    $("#errorcheckbox").css("display", "none");
    }else{
    $("#errorcheckbox").css("display", "block");
    $('#errorcheckbox').html('Choose at least one Hobby.');
    }

    var nullCounter = $(".errorBlock:visible").length;
    if(nullCounter === 0){
    return true;
    }else{
    return false;
    }
    }

    function submitformdata()
    {
    var id = $('#id').val();
    var text = $('#text').val();
    var dropdown = $('#dropdown').val();
    var radio = $("input[name='gender']:checked").val();
   
    var checkboxval = [];
    $("#checkbox:checked").each(function() {
    checkboxval.push($(this).val());
    });
    var selectcheckboxval;
    selectcheckboxval = checkboxval.join(',') ;

    var dataValues = new FormData();

    dataValues.append('id', id);
    dataValues.append('text', text);
    dataValues.append('dropdown', dropdown);
    dataValues.append('radio', radio);
    dataValues.append('selectcheckboxval', selectcheckboxval);

    var singleFile = $("#singleFile").get(0).files.length;
    if(singleFile > 0){
    dataValues.append('singleFile', $("#singleFile").get(0).files[0]);
}

    var totalfiles = $("#multiplefile").get(0).files.length;
    if(totalfiles > 0){
    for (var index = 0; index < totalfiles; index++) {
    dataValues.append("multiplefile[]", $("#multiplefile").get(0).files[index]);
    }
}

    $.ajax({
    type: "POST",
    data: dataValues,
    contentType: false,
    cache: false,
    processData: false,
    dataType: "json",
    url: "<?php echo base_url('form/updateform');?>",
    success: function (result) {
    var objToString = JSON.stringify(result);
    var stringToArray = [];
    stringToArray.push(objToString);
    var jsonObj = $.parseJSON(stringToArray);
    var message = jsonObj.Common.Message;
   
    if (message == "Record updated.") {
    window.location.href = "<?php echo base_url('form/index'); ?>";
    } else {
                        swal("Wrong", "Something Wrong,try again.)", "error");
                    }
    }
    });
}
</script>

SQL Script
CREATE TABLE IF NOT EXISTS `tbl_form` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `text` varchar(100) NOT NULL,
  `dropdown` varchar(10) NOT NULL,
  `radio` varchar(10) NOT NULL,
  `checkbox` varchar(100) NOT NULL,
  `singleFile` varchar(100) NOT NULL,
  `multiplefile` varchar(255) NOT NULL,
  `status` tinyint(1) NOT NULL,
  `cdate` datetime(6) NOT NULL,
  `udate` datetime(6) NOT NULL,
  PRIMARY KEY (`id`)
)