Блог

Я отправляю форму на удаленный сервер с помощью метода action, но вызываю функцию jquery для обновления базы данных до публикации — все работает нормально в IE, FF и т. Д. … Но Safari всегда не выполняет вставку базы данных jquery, когда return имеет значение true ИЛИ async: true, … еслиоба являются ложными (поэтому html-форме не удается опубликовать сообщение из-за ложного объявления), это работает отлично? Но при значении true форма будет просто отправлена, но сообщение jquery ajax не будет запущено?

Форма…

  <form action="http://anotherplace" method="post" id="myform" >

<button class="button-big" type="submit" id="myform-post" ><span>Continue</span></button>
  

Функция …

    $(document).ready(function() { //available when doc renders


   $("form#myform").submit(function(){

    var title = $("select#title").val();
    if (title == "") {
    $("select#title").css({backgroundColor:"#ccc"});        
    $("select#title").focus();
     return false;
   }

     var firstname = $("input#fname").val();
    if (firstname == "") {
     $("input#fname").css({backgroundColor:"#ccc"});
     $("input#fname").focus();
     return false;    }

      var surname = $("input#sname").val();
    if (surname == "") {
     $("input#sname").css({backgroundColor:"#ccc"});
     $("input#sname").focus();
     return false;    }



//Grab the form values to pass via AJAX for DB insert

var cameraMake = $("input#cameraMake").val();
var cameraModel = $("input#cameraModel").val();
var cameraValue = $("input#cameraValue").val();
var mp3Make = $("input#mp3Make").val();
var mp3Model = $("input#mp3Model").val();
var mp3Value = $("input#mp3Value").val();


        var dataString='amp;title='  title    'amp;firstname='   firstname   'amp;surname='   surname   'amp;add1='   add1   'amp;add2='   add2   'amp;add3='   add3   'amp;pcode='   pcode   'amp;email='   email   'amp;phone='   phone  'amp;username='   username   'amp;pword='   pword; 

var ajaxComplete = false;
if( !ajaxComplete ){
        $.ajax({
            async: true,              
            type: "POST",
            url: "process-.php",
            data: dataString,
            success: function() {
               // $('#details').html("<div id='post-message'></div>");
               // $('#post-message').html("<h2 style='color:#fff'>Thanks for getting in touch.</h2>")

                ajaxComplete = true;
                this.submit();

            }
        });
        return false; // Abort form submission by now
    }else{
        return true; // Submit normally
    }
});


}); //End of document.ready
  

Скрипт запускается методом «click» на основе идентификатора отправки (выполняет проверку, а затем публикацию AJAX).

Может ли кто-нибудь дать какие-либо советы по поводу сбоя в Safari (все протестированные версии) или предложить лучшее решение для выполнения того, что мне нужно? — что-то связано с асинхронностью / публикацией? Как я уже сказал, установите значение false, и оно работает нормально… НО мне нужна HTML-форма для публикации!

Большое спасибо!

Если я правильно понимаю, вы хотите выгрузить страницу, пока есть ожидающий запрос AJAX. У этого мало шансов работать правильно, даже в браузерах, где он, похоже, работает.

Мой совет — сначала прервать POST-запрос формы ( return false; ) и добавить код в success обработчик, чтобы инициировать отправку формы при завершении AJAX-запроса. Вы можете использовать переменную флага, чтобы запрос AJAX запускался только в первый раз.

Обновить:

Немного быстрого, грязного и непроверенного кода. Я также понял, что вы пропустили начало блока кода, поэтому я просто изобрел его:

 var ajaxComplete = false;
$("form#3-form").submit(function(){
    if( !ajaxComplete ){
        $.ajax({
            async: true,              
            type: "POST",
            url: "process-.php",
            data: dataString,
            success: function() {
                $('#details').html("<div id='post-message'></div>");
                $('#post-message').html("<h2 style='color:#fff'>Thanks for getting in touch.</h2>")

                ajaxComplete = true;
                this.submit();

            }
        });
        return false; // Abort form submission by now
    }else{
        return true; // Submit normally
    }
});
  

вы должны использовать

 return false;
  

а затем перейдите к действию формы

 window.location.url = "YOUR URL";
  

Итак

 $.ajax({
    async: true,              
    type: "POST",
    url: "process-.php",
    data: dataString,
    success: function() {
        $('#details').html("<div id='post-message'></div>");
        $('#post-message').html("<h2 style='color:#fff'>Thanks for getting in touch.</h2>");
        window.location.url = "YOUR URL";
    }
});
return false;