So I have a form with some text field and three file field too. On submit I want to insert the new user into my database and I want to save the three individual files (images) with different names to my server. I read about CodeIgniter's file uploading class but I am not able to implement it into my code.
That's what I tried.
Controller
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Test extends CI_Controller {
public function __construct() {
parent::__construct();
if (!is_logged_in()) {
redirect('login');
}
}
public function index()
{
$this->load->view('templates/header');
$this->load->view('pages/test_view');
$this->load->view('templates/footer');
}
public function newUser(){
$this->load->model('TestModel');
$new_user = array (
'FirstName' => $this->input->post('inputFirstName'),
'LastName' => $this->input->post('inputLastName')
);
$insert_id = $this->TestModel->insertNewUser($new_user);
$config['upload_path'] = base_url().'img/users/';
$config['allowed_types'] = 'jpeg|jpg|png';
$config['overwrite'] = TRUE;
$config['file_name'] = $insert_id."_index";
$this->load->library('upload', $config);
if ($this->upload->do_upload('index'))
{
$data = array('upload_data' => $this->upload->data());
} else {
$error = array('error' => $this->upload->display_errors());
}
$config['file_name'] = $insert_id."_picture1";
$this->load->library('upload', $config);
if ($this->upload->do_upload('picture1'))
{
$data = array('upload_data' => $this->upload->data());
} else {
$error = array('error' => $this->upload->display_errors());
}
$config['file_name'] = $insert_id."_picture2";
$this->load->library('upload', $config);
if ($this->upload->do_upload('picture2'))
{
$data = array('upload_data' => $this->upload->data());
} else {
$error = array('error' => $this->upload->display_errors());
}
//redirect('test');
}
}
View
<div class="container">
<div class="row justify-content-center">
<div class="col text-center">
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary margin-t newButton" data-toggle="modal" data-target="#newUserModal">
Add user
</button>
</div>
</div>
</div>
<!-- New User Modal -->
<div class="modal fade" id="newUserModal" tabindex="-1" role="dialog" aria-labelledby="newUserModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="newUserModalLabel">New user</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form role="form" method="post" id="new-user-form" class="needs-validation" action="<?= base_url(); ?>test/newUser" novalidate>
<div class="form-row">
<div class="col-md-6 mb-3">
<label for="inputFirstName">First name</label>
<input type="text" class="form-control" name="inputFirstName" id="inputFirstName" placeholder="" required>
<div class="invalid-feedback">
Invalid input
</div>
</div>
<div class="col-md-6 mb-3">
<label for="inputLastName">Last name</label>
<input type="text" class="form-control" name="inputLastName" id="inputLastName" placeholder="" required>
<div class="invalid-feedback">
Invalid input
</div>
</div>
</div>
<div class="form-row">
<div class="col-md-4 mb-3">
<div class="avatar-upload">
<div class="avatar-edit">
<input type='file' name="index" id="indexImageUpload" accept=".png, .jpg, .jpeg" />
<label class="text-center" for="indexImageUpload"></label>
</div>
<div class="avatar-preview">
<div id="indexImage" style="background-image: url(https://ryanacademy.ie/wp-content/uploads/2017/04/user-placeholder.png)">
</div>
</div>
</div>
</div>
<div class="col-md-4 mb-3">
<div class="avatar-upload">
<div class="avatar-edit">
<input type='file' name="picture1" id="picture1Upload" accept=".png, .jpg, .jpeg" />
<label class="text-center" for="picture1Upload"></label>
</div>
<div class="avatar-preview">
<div id="picture1" style="background-image: url(https://ryanacademy.ie/wp-content/uploads/2017/04/user-placeholder.png)">
</div>
</div>
</div>
</div>
<div class="col-md-4 mb-3">
<div class="avatar-upload">
<div class="avatar-edit">
<input type='file' name="picture2" id="picture2Upload" accept=".png, .jpg, .jpeg" />
<label class="text-center" for="picture2Upload"></label>
</div>
<div class="avatar-preview">
<div id="picture2" style="background-image: url(https://ryanacademy.ie/wp-content/uploads/2017/04/user-placeholder.png)">
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary closeButton" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" form="new-user-form">Save</button>
</div>
</div>
</div>
</div>
