Предупреждающее сообщение AJAX Javascript Не отображается при вводе Type = "file"

Я передаю сообщения проверки предупреждений в многостраничной форме, в которой также есть поле файла с использованием AJAX, JSON в codeigniter. Но предупреждающее сообщение работает со всеми полями формы, кроме input type = "file". он показывает предупреждающее сообщение идеально в каждом поле, но не в поле изображения. Для более подробной информации я упомянул свой код ниже, если возникла какая-либо ошибка, пожалуйста, помогите мне.

Код HTML-формы ##

<div id = "mes></div> 
<div class = "form-group row">                                    
    <div class = "col-md-3 col-xs-12">                                                                                
        <input type = "text" name = "title" class = "form-control input-sm" placeholder = "Title here">
    </div>
    <div class = "col-md-4 col-xs-12">                                                                                
        <input type = "text" name = "detail" class = "form-control input-sm" placeholder = "Description here">
    </div>
    <div class = "col-md-2 col-xs-12">                                                                                
        <input type = "file" name = "img" class = "form-control input-sm">                            
    </div>
    <div class = "col-md-1 col-xs-12">                                                                                
        <input type = "text" name = "orderby" class = "form-control input-sm" placeholder = "Order No">                 
    </div>
    <div class = "col-md-2 col-xs-12 text-right">
        <label></label>
        <div class = "btn-group">
            <a type = "submit" class = "btn btn-success btn-sm" id = "search" title = ""><i class = "fa fa-search"></i> Search</a>
            <button type = "submit" class = "btn btn-success btn-sm" id = "save" title = ""><i class = "fa fa-save"></i> Save</button>
        </div>                                      
    </div>
</div>                              

Код Javascript

jQuery(document).ready(function($) 
{ 
    $('#formData').ajaxForm( 
    {
        beforeSubmit: function(formData, jqForm, options)
        { $("div#mes").html(''); },
        success:function(res)
        {             
            var result= $.parseJSON(res);
            $("div#mes").html('<div class = "alert '+result.mes+' alert-dismissable" role = "alert"><button type = "button" class = "close" data-dismiss = "alert" aria-hidden = "true">&times;</button>'+result.msg+'</div>');
            if (result.mes == 'text-success') 
            {
                $('#formData').clearForm();
            }
        }           
    });   
});

Код контроллера

public function save(){     
    $res = array();     
    //form field validation rules
    $this->form_validation->set_rules('title', 'Title', 'required');
    $this->form_validation->set_rules('detail', 'Detail', 'required');
    $this->form_validation->set_rules('orderby', 'Set Order', 'required|is_unique[slider.orderby]');    
    //form Validation
    if (!$this->form_validation->run()) {           
        echo json_encode(array('mes' => 'alert-danger', 'msg' => 'Opps! Something wrong please check the fields below.'));          
        exit;
    }           
    // imaage configuration
    $config['upload_path'] = 'fassets/images/slider';
    $config['allowed_types'] = 'jpg|jpeg|png|gif';
    $config['file_name'] = $_FILES['img']['name'];
    //Load upload library and initialize configuration
    $this->load->library('upload', $config);            
    if (!$this->upload->do_upload('img'))
    {       
        $error = $this->upload->display_errors('', '<br>');
        echo json_encode(array('mes' => 'alert-danger', 'msg' => $error));
        exit;           
    }
    //prepare data      
    $userData = array(
        'title' => $this->input->post('title'),
        'detail' => $this->input->post('detail'),                               
        'img' =>  $this->upload->data('file_name'),
        'orderby'=> $this->input->post('orderby')
    );         
    //Pass user data to model
    $insertUserData = $this->slidermodel->insert($userData);

    //Storing insertion status message.
    if ($insertUserData){
        $res = array(
            'mes' => 'alert-success',
            'msg' => "Record has been saved successfully.",
        );
        echo json_encode($res);
    } else {
        $res = array(
            'mes' => 'alert-danger',
            'msg' => "Oops! Something went wrong.",
        );
        echo json_encode($res);
    }         
}   

Если проверка формы прошла и загрузка не удалась, вы должны увидеть свой $error = $this->upload->display_errors('', '<br>');; ты не?

Alex 01.05.2018 21:30

Да Ошибка появляется, отправляется серверной частью, но не отображается на стороне клиента ...

Kh.Mubashar Irshad 02.05.2018 06:09

Извините: вы можете перефразировать? Вы имеете в виду, что вы видите ошибку в кодировке json в инструментах разработчика, но она просто не отображается?

Alex 02.05.2018 06:24

Фактически все (проверка формы и ошибка отображения) передаются из бэкэнда, но на стороне клиента появляется только ошибка формы ... если я оставил текстовое поле пустым, отображается сообщение об ошибке ... 'Opps! Что-то не так, пожалуйста, проверьте поля ниже. Но если я оставил поле файла, ошибка не отображается ...

Kh.Mubashar Irshad 02.05.2018 07:03

Хорошо, а когда вы заполняете все, включая изображение, все ли правильно вводится в базу данных и загружается изображение? Мне кажется странным, что ошибки загрузки изображения не отображаются, поскольку код совпадает с кодом проверки формы.

Alex 02.05.2018 07:14

да, если я заполню все поля правильно, появится сообщение об успехе и запись будет вставлена ​​в db. успешно

Kh.Mubashar Irshad 02.05.2018 07:41

еще одна вещь, которая очень странная, если я попытаюсь загрузить файл другого формата, ожидая формата изображения, такого как pdf и docx, тогда на экране появляются ошибки, что это неправильный формат ... :)

Kh.Mubashar Irshad 02.05.2018 07:43

У вас есть <div id = "mes></div> без кавычки: <div id = "mes"></div>. Не думаю, что это проблема. Вам следует удалить $config['file_name'] = $_FILES['img']['name'];, потому что он избыточен, поскольку CI уже делает это, и, возможно, потому, что он не определен, когда файл не загружен, поэтому вы получаете «фактический» вывод ошибки, а не json. Также вы просматривали инструменты разработчика> сеть> имя страницы запроса> ответ, чтобы увидеть результат запроса ajax в состоянии "ошибка"?

Alex 02.05.2018 08:03
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
8
508
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Эта строчка ваша проблема $config['file_name'] = $_FILES['img']['name'];

Вы можете удалить эту строку, так как CI уже делает это за вас!

Когда ничего не загружено и включен отчет об ошибках, вы получите вывод, в котором будет указано что-то вроде Message: Undefined index: img в вашем вызове ajax. Таким образом, ваш скрипт не сможет проанализировать ответ json.

Для дальнейшего использования вы можете отлаживать вызовы ajax, просматривая его возвращенное содержимое в Developer Tools > Network > {REQUEST_NAME} > Response (бесценный инструмент).

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