Показать модальный загрузочный диск, не работающий в хромированном состоянии

Я новичок в js. Я попытался загрузить show (), которые загружают gif-файл, но в chrome его не работает, и он отлично работает в Firefox.

Я загружаю изображение, чем использую async : false для истинного вызова. В Firefox все работает отлично, но в хроме ничего не работает. Я хочу загрузить gif-файл. change async = true

Я попытался решить этот вопрос, и у меня есть решение, в котором говорится об изменении

hide

В этом случае код работает и в хром ...

Но когда я modalэто скрывает анимированные только 1 сек и чем , а затем перезагрузите страницу через некоторые секунды , как я хочу.modalajax

Все, что я хочу, это не до showтех async = trueпор, пока не ajaxзавершится его обработка. После завершения перезагрузите страницу до showанимации gif.

Если я сменил modalхром и firefox, спрячьте их в modalтечение секунды.

Код

    function submitProfileImage(text,formmodels) {
      $(document).ajaxStart(function(){
      $(".temp").show();
      });
     $(document).ajaxComplete(function(){
      $(".temp").hide();
      });
     uploadImage(text,formmodels);
     }
   function uploadImage(text,formmodels){
    var file = document.getElementById('profile_pic').files[0];
    if($('#profile_pic').val()==""){
    alert('Please select the file you want to upload.');
    return false;}
    if(file && file.size < 1048576) {
    } else {
      alert("Your file size is too big.Please upload files upto 1 MB.");
      $('#myFilesModal').show();
      $('.temp').hide();
      return false;
    }

     var formData = new FormData($('form.'+text)[0]);
        $.ajax({
        url: "<?= WEBSITE_URL ?>profile/submitProfileData",
        type: "POST",
        data:  formData,
        enctype:"multipart/form-data",
        contentType: false,
        cache: false,
        processData:false,
        // beforeSend: function () { 
        //     $('.temp').show();
        // },
        success: function(data) {
            $('.temp').show();
            if(data ==3) {alert("Maximum file size allowed is 1 MB.");
            }
            else if(data ==1) {alert("Please select lower size file. Your   file size is max.");
            }
            else if(data ==2) {alert("Please select valid file type.");
            }
            else if(data =='Please enter the mandatory fields') {
                alert(data +"(*)");
            } else if (data ==4 ) { 
                         //$('#myFilesModal').modal('hide');
                         window.location="<?php
                         echo WEBSITE_URL;
                         ?>/profile/index/<?php
                          echo Model::encryptURL($userid);
                          ?>";

            }
        },
        error: function(jqXHR, textStatus, errorThrown){
            alert(jqXHR);
        },
        async:   false
        });   
  }

и модальные ..

    <div class="modal fade" id="myFilesModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
       <div class="modal-content">
        <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>
       <h4 class="modal-title" id="myModalLabel">Files</h4>
      </div>
    <form class="imageFilesForm" method="POST" enctype="multipart/form-data">
    <fieldset>
        <div class="modal-body">
            <ul class="nav nav-list">

                <li class="nav-header">File</li>
                <li><input type="file" id="profile_pic" name="profile_pic"  data-bfi-disabled accept="image/*" /></li>
            </ul>
            <input type="hidden" name="form" id="forms" value="filesform" />
        </div>
        <div class="temp" style="display:none">
            <center><img src="<?= WEBSITE_URL ?>utilities/ajax-loader.gif" alt="Waiting..." /></center>
        </div>
    </fieldset>
  </form>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <input type="button" data-dismiss="modal" data-toggle = "modal" data-backdrop="false" class="btn btn-primary" 
    onclick="submitProfileImage('imageFilesForm','myFilesModal');" value="Save"/>
  </div>
</div>

пожалуйста, ваши предложения ...

Примечание: - Он отлично работает в firefox, когда async = false.

javascript,jquery,ajax,google-chrome,modal-dialog,

2

Ответов: 0

Показать модальный загрузочный диск, не работающий в хромированном состоянии

Я новичок в js. Я попытался загрузить show (), которые загружают gif-файл, но в chrome его не работает, и он отлично работает в Firefox.

Я загружаю изображение, чем использую async : false для истинного вызова. В Firefox все работает отлично, но в хроме ничего не работает. Я хочу загрузить gif-файл. change async = true

Я попытался решить этот вопрос, и у меня есть решение, в котором говорится об изменении

hide

В этом случае код работает и в хром ...

Но когда я modalэто скрывает анимированные только 1 сек и чем , а затем перезагрузите страницу через некоторые секунды , как я хочу.modalajax

Все, что я хочу, это не до showтех async = trueпор, пока не ajaxзавершится его обработка. После завершения перезагрузите страницу до showанимации gif.

Если я сменил modalхром и firefox, спрячьте их в modalтечение секунды.

Код

    function submitProfileImage(text,formmodels) {
      $(document).ajaxStart(function(){
      $(".temp").show();
      });
     $(document).ajaxComplete(function(){
      $(".temp").hide();
      });
     uploadImage(text,formmodels);
     }
   function uploadImage(text,formmodels){
    var file = document.getElementById('profile_pic').files[0];
    if($('#profile_pic').val()==""){
    alert('Please select the file you want to upload.');
    return false;}
    if(file && file.size < 1048576) {
    } else {
      alert("Your file size is too big.Please upload files upto 1 MB.");
      $('#myFilesModal').show();
      $('.temp').hide();
      return false;
    }

     var formData = new FormData($('form.'+text)[0]);
        $.ajax({
        url: "<?= WEBSITE_URL ?>profile/submitProfileData",
        type: "POST",
        data:  formData,
        enctype:"multipart/form-data",
        contentType: false,
        cache: false,
        processData:false,
        // beforeSend: function () { 
        //     $('.temp').show();
        // },
        success: function(data) {
            $('.temp').show();
            if(data ==3) {alert("Maximum file size allowed is 1 MB.");
            }
            else if(data ==1) {alert("Please select lower size file. Your   file size is max.");
            }
            else if(data ==2) {alert("Please select valid file type.");
            }
            else if(data =='Please enter the mandatory fields') {
                alert(data +"(*)");
            } else if (data ==4 ) { 
                         //$('#myFilesModal').modal('hide');
                         window.location="<?php
                         echo WEBSITE_URL;
                         ?>/profile/index/<?php
                          echo Model::encryptURL($userid);
                          ?>";

            }
        },
        error: function(jqXHR, textStatus, errorThrown){
            alert(jqXHR);
        },
        async:   false
        });   
  }

и модальные ..

    <div class="modal fade" id="myFilesModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
       <div class="modal-content">
        <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>
       <h4 class="modal-title" id="myModalLabel">Files</h4>
      </div>
    <form class="imageFilesForm" method="POST" enctype="multipart/form-data">
    <fieldset>
        <div class="modal-body">
            <ul class="nav nav-list">

                <li class="nav-header">File</li>
                <li><input type="file" id="profile_pic" name="profile_pic"  data-bfi-disabled accept="image/*" /></li>
            </ul>
            <input type="hidden" name="form" id="forms" value="filesform" />
        </div>
        <div class="temp" style="display:none">
            <center><img src="<?= WEBSITE_URL ?>utilities/ajax-loader.gif" alt="Waiting..." /></center>
        </div>
    </fieldset>
  </form>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <input type="button" data-dismiss="modal" data-toggle = "modal" data-backdrop="false" class="btn btn-primary" 
    onclick="submitProfileImage('imageFilesForm','myFilesModal');" value="Save"/>
  </div>
</div>

пожалуйста, ваши предложения ...

Примечание: - Он отлично работает в firefox, когда async = false.

02JavaScript, JQuery, AJAX, Google-хром, модальной диалог,
Похожие вопросы
Яндекс.Метрика