Jquery Ajax not working properly on Mobile Browser as well as Macos

Asked

Viewed 330 times

1

The following code works perfectly in the Windows 10 Browser, but it doesn’t work in the Android/IOS mobile browser completely and in Macos gives a message telling the user that it is not working well. The problem seems to be in: success: function(result).

The rest of the code works, the only thing is it doesn’t work is div $('#warning'), so I tested it in isolated parts. When executed in parts works, but is within the full code not.

$(function () {

    $("form[name='form-inscricao']").submit(function(e){
        e.preventDefault();

        var $form = $(this);

        var $inputs = $form.find("input, select, button, textarea");

        var serializedData = $form.serialize();

        $inputs.prop("disabled", true);

        $.ajaxSetup({
            contentType: "application/x-www-form-urlencoded; charset=UTF-8"
        });

        $.ajax({
            url:'https://www.example.com/wp-content/themes/example.com/enviar.php',
            type: 'post',
            dataType: 'html',
            data: serializedData,
            async: false,
            beforeSend: function(){
                $('.loader').show();
                $('#aviso').text('');
            },
            error: function() {
                console.log('Something went wrong');
            },
            success: function(result){
                $('#aviso').append(result).css({opacity:1.0}).delay(1000).animate({opacity : 0},500);
            },
            complete: function(){
                $('.loader').hide();
                $form.get(0).reset();
                $inputs.prop("disabled", false);

            }});

        });
});
jquery ajax mobile browser
  • 2

    This is Stackoverflow in English, please translate your question, or move to Stackoverflow in English.

  • You edited the question to be in English, but now the problem is unclear. Set "not working".

  • It may be other plugins or scripts before this, please give details.

1 answer

0

The problem was related to the HTTPS protocol in the URL, for some reason the Mobile Browser is redirected to the http URL without SSL while the browser does not. This way the ajax could not return the request to the correct URL. All I did was delete the part of the URL that included http and leave it only from the root folder.

Note: This problem is more likely to happen when using a PHP framework like Wordpress and you do not correctly write the Links and URLS of the site, especially in js scripts like this.

        $.ajax({
            url:'/wp-content/themes/example.com/enviar.php',

Browser other questions tagged jquery ajax mobile browser

You are not signed in. Login or sign up in order to post.