Загрузить изображение в базу данных с помощью Ajax и Codeigniter

У меня есть CRUD с работающим ajax, но я хочу реализовать в него загрузку файла.

Все работает нормально, кроме загрузки изображения, изображение - единственное, что не сохраняется в базе данных и папке, все остальные данные сохраняются. Это мой контроллер CRUD (просто добавляемая часть), в котором я реализовал код загрузки (дадо)

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class dados extends CI_Controller {
 public function __construct()
    {
        parent::__construct();
        $this->load->helper(array('form', 'url'));
        $this->load->model('dados_model');
        $this->load->database();
    }

public function index()
{
    $data['dados']=$this->dados_model->get_all_dados();
    $this->load->view('dados_view',$data);
}
public function dados_add()
    {       
$config = array(
'upload_path' => "./assets/uploads",
'allowed_types' => "gif|jpg|png|jpeg|pdf",
'overwrite' => TRUE,
'max_size' => "2048000", 
 );
$this->load->library('upload',$config);

$this->upload->do_upload('userfile');

$data2=array('upload_data' => $this->upload->data());

    $data = array(
                'Name' => $this->input->post('Name'),
                'City' => $this->input->post('City'),
                'address' => $this->input->post('address'),
                'lastname' => $this->input->post('lastname'),
                'Image' =>$data2['upload_data']['file_name']
            );
     $this->dados_model->dados_add($data);

        echo json_encode(array("status" => TRUE));
    }

    public function ajax_edit($id)
    {
        $data = $this->dados_model->get_by_id($id);
        echo json_encode($data);
    }

А это моя Модель, я использую ее для хранения данных в базе данных (dados_model)

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

  class dados_model extends CI_Model
  {

var $table = 'dados';
public function __construct()
{
    parent::__construct();
    $this->load->database();
}
    public function get_all_dados()
    {
     $this->db->from('dados');
     $query=$this->db->get();
     return $query->result();
    }

public function get_by_id($id)
{
    $this->db->from($this->table);
    $this->db->where('ID',$id);
    $query = $this->db->get();

    return $query->row();
}

public function dados_add($data)
{
    $this->db->insert($this->table, $data);
    return $this->db->insert_id();
}

Это мой код Ajax для сохранения

<script type = "text/javascript">
$(document).ready( function () {
  $('#table_id').DataTable();
   } );
   var save_method; //for save method string
   var table;

function add_person()
{
  save_method = 'add';
  $('#form')[0].reset(); // reset form on modals
  $('#modal_form').modal('show'); // show bootstrap modal
//$('.modal-title').text('Add Person'); // Set Title to Bootstrap modal 
       title
       }

function save()
{
  var url;
  if (save_method == 'add')
  {
      url = "<?php echo site_url('dados/dados_add')?>";
  }
  else
  {
    url = "<?php echo site_url('dados/dados_update')?>";
  }
   // ajax adding data to database
      $.ajax({
        url : url,
        type: "POST",
        data:$('#form').serialize(),
        dataType: "JSON",
        success: function(data)
        {
           //if success close modal and reload ajax table
           $('#modal_form').modal('hide');
          location.reload();// for reload a page
        },
        error: function (jqXHR, textStatus, errorThrown)
        {
            alert('Error adding / update data');
        }
    });
}

и это моя модальная форма для сохранения

 <!-- Bootstrap modal -->
<div class = "modal fade" id = "modal_form" role = "dialog">
 <div class = "modal-dialog">
 <div class = "modal-content">
  <div class = "modal-header">
    <button type = "button" class = "close" data-dismiss = "modal" aria- 
     label = "Close"><span aria-hidden = "true">&times;</span></button>
    <h3 class = "modal-title">dados Form</h3>
    </div>
    <div class = "modal-body form">


    <form action = "#"  method = "post" enctype = "multipart/form-data" id = "form" 
    class = "form-horizontal">
      <input type = "hidden" value = "" name = "ID"/>
      <div class = "form-body">
        <div class = "form-group">

          <label class = "control-label col-md-3">Name</label>
          <div class = "col-md-9">
            <input name = "Name" placeholder = "" class = "form-control" 
            type = "text">
          </div>
        </div>

        <div class = "form-group">
          <label class = "control-label col-md-3">City</label>
          <div class = "col-md-9">
            <input name = "City" placeholder = "City" class = "form-control" 
           type = "text">
          </div>
        </div>

           <div class = "form-group">
           <label class = "control-label col-md-3">Address</label>
           <div class = "col-md-9">
           <input name = "Address" placeholder = "" 
            class = "form-control" type = "text">

          </div>
          </div>

            <div class = "form-group">
            <label class = "control-label col-md-3">Last Name</label>
            <div class = "col-md-9">
            <input name = "lastname" placeholder = "" class = "form-control" 
             type = "text">

                </div>
                </div>
                <div class = "form-group">
                 <label class = "control-label col-md-3">Image</label>
                 <div class = "col-md-9">
                <input type = "file" name = "userfile" placeholder = "" class = "form-control">
            </div>
      </div>                            
     </div>
    </div>
      <div class = "modal-footer">
        <button type = "submit" class = "btn btn-danger" data- 
         dismiss = "modal">Cancel</button>
        <input type  = "submit" name = "submit" value = "Salvar"  id = "btnSave " 
        onclick = "save()" class = "btn btn-primary" />
        </div>

         </form>
     </div><!-- /.modal-content -->
   </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->
 <!-- End Bootstrap modal -->

</body>
</html>

возможный дубликат stackoverflow.com/questions/41585537/…

curiosity 14.09.2018 02:30
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Symfony Station Communiqué - 7 июля 2023 г
Symfony Station Communiqué - 7 июля 2023 г
Это коммюнике первоначально появилось на Symfony Station .
Оживление вашего приложения Laravel: Понимание режима обслуживания
Оживление вашего приложения Laravel: Понимание режима обслуживания
Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...
Установка и настройка Nginx и PHP на Ubuntu-сервере
Установка и настройка Nginx и PHP на Ubuntu-сервере
В этот раз я сделаю руководство по установке и настройке nginx и php на Ubuntu OS.
Коллекции в Laravel более простым способом
Коллекции в Laravel более простым способом
Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...
Как установить PHP на Mac
Как установить PHP на Mac
PHP - это популярный язык программирования, который используется для разработки веб-приложений. Если вы используете Mac и хотите разрабатывать...
1
1
691
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Сначала попробуйте добавить "/" в конец 'upload_path' => "./assets/uploads" в вашем коде. Таким образом, у вас будет полный путь к изображению.

Кроме того, чтобы вы знали, загрузка такого изображения сохранит изображение на вашем сервер по указанному пути. Это означает, что вам необходимо сохранить имя файла в базе данных. Поэтому убедитесь, что 'Image' =>$data2['upload_data']['file_name'] действительно имеет правильное имя файла, чтобы при запросе этого имени файла из базы данных вы могли найти его по адресу ./assets/uploads/filename на вашем компьютере. сервер.

Кроме того, Что вы получите, если сделаете var_dump ($ data2 ['upload_data'] ['file_name'])?

Что вы получите, если после вызова do_upload вы выполните var_dump ($ this-> upload-> display_errors ())?

используя var_dump ($ data2 ['upload_data'] ['file_name']); Я получаю это: строка (0) ""

Lucas Ln 13.09.2018 22:43

Кроме того, я уже тестировал этот код загрузки в отдельном приложении и работал хорошо, так что, думаю, проблема в моем коде ajax.

Lucas Ln 13.09.2018 22:56

Хорошо, вы не устанавливаете имя файла. В массиве конфигурации добавьте 'file_name' => 'filenamehere'. Убедитесь, что в конце имени файла вы добавляете тип изображения. т.е. png, jpeg и т. д. Дайте мне знать, каковы ваши результаты.

cvb 13.09.2018 22:57

Используя этот метод, он сохраняется в базе данных как 'image.png', но все изображения, которые я загружаю, будут сохранены как 'image.png', если я не укажу имя файла, он будет сохранен с исходным именем файла (.расширение)

Lucas Ln 14.09.2018 00:22
Ответ принят как подходящий

после поиска некоторых кодов ajax это то, что сработало для меня

Я изменил свою функцию ajax на это

function save()
{
  var url;
  if (save_method == 'add')
  {
      url = "<?php echo site_url('dados/dados_add')?>";
  }
  else
  {
    url = "<?php echo site_url('dados/dados_update')?>";
  }

    $('#form').submit(function(e) 
    {


       $.ajax({
        url : url,
        type: "POST",
        data: new FormData(this),
        dataType: "JSON",
         processData:false, 
         contentType:false,
         cache:false,
         async:false,
        success: function(data)
        {
           //if success close modal and reload ajax table
           $('#modal_form').modal('hide');
          location.reload();// for reload a page
        },
        error: function (jqXHR, textStatus, errorThrown)
        {
            alert('Error adding / update data');
        }
       });
      });
      }

Другие вопросы по теме