D
D
Dmitry23072021-03-11 17:01:35
AJAX
Dmitry2307, 2021-03-11 17:01:35

Why does Ajax fire 2 times when the button is clicked again?

When the button is clicked again, Ajax is executed 1 more time. Please help me figure it out
The function saves the image to the server and displays the loaded

HTML image on the screen

<form class="upload_img" method="POST" enctype="multipart/form-data">
          <p class="tovar__parser_img">
            <input type="file" id="upload_input" multiple="multiple" name="img">
            <input type="submit" id="upload_img" value="Загрузить файл img">
            <input type="submit" id="upload_imgdop" value="Загрузить файл imgdop">
          </p>
        </form>
        
        <div class="col-4 tovar__parser_imgdop">
          <p>
          </p>
        </div>


JS
// Загрузка файла imgdop
    $("#upload_imgdop").click(function() {
        $(".upload_img").submit(function(event) {
            event.preventDefault();
            
            var fileData = $('#upload_input').prop('files')[0];
            var formData = new FormData(); 
            formData.append('newFile', fileData); 
            
            if (typeof formData == 'undefined') console.log("нет файла");             
            $.ajax({
                type: "post",
                url: "core/upload_img.php",
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                success: function(data){
                    if (data != 'Файл не загружен' || data != "Файл должен быть менее 2 Мб") {
                        $(".tovar__parser_imgdop p").append('<img src="./img/'+data+'">');
                        var dir = $("#img_parse").val();
                        $(".form__parse_add").find($("input[name=imgdop]")).val(dir+data);
                    } else { console.log(data); }
                    console.log(data);
                }
            });
        });
    });


php
if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_FILES['newFile'])) {

  $errors = array();
  $file_name = $_FILES['newFile']['name'];
  $file_size = $_FILES['newFile']['size'];
  $file_tmp = $_FILES['newFile']['tmp_name'];
  $file_type = $_FILES['newFile']['type'];

  if ($file_size > 2097152) $errors[] = "Файл должен быть менее 2 Мб";

  if (empty($errors) == true) {
    if (move_uploaded_file($file_tmp, "../img/".$file_name)) echo $file_name;
    else echo "Файл не загружен";
  } else echo $errors;
}

Answer the question

In order to leave comments, you need to log in

1 answer(s)
V
VladJs, 2021-03-11
@Dmitry2307

$("#upload_imgdop, .upload_img").click(function(event) {
event.preventDefault();
var fileData = $('#upload_input').prop('files')[0];
var formData = new FormData ();
formData.append('newFile', fileData);
if (typeof formData == 'undefined') console.log("no file");
$.ajax({
type: "post",
url: "core/ upload_img.php",
data: formData,
cache: false,
contentType: false,
processData: false,
success: function(data){
if (data != 'File not uploaded' || data != "File must be less than 2 MB ") {
$(".product__parser_imgdop p").append(''+data+'');
var dir = $("#img_parse").val();
$(".form__parse_add").find($("input[name=imgdop]")).val(dir+data);
} else { console.log(data); }
console.log(data);
}
});
});
Try this, through whom to register
$("#upload_imgdop, .upload_img").click(function(event) {
event.preventDefault();

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question