0

PROBLEM:

Occasionally users have reported that instead of an ajax submit from happening they end up on http://phppos/.PHP-Point-Of-Sale-Prev/index.php/items/save/1 (with json data showing up to the end user). (This is suppose to be ajax)

I haven't been able to reproduce this myself and am unsure how it is happening.

I am looking for ways to reproduce problem.

You can try the form by going to:

http://demo.phppointofsalestaging.com/

CLICK LOGIN

Then navigate to:

http://demo.phppointofsalestaging.com/index.php/items/view/1/2

HTML

<form action="http://phppos/.PHP-Point-Of-Sale-Prev/index.php/items/save/1" method="post" accept-charset="utf-8" id="item_form" class="form-horizontal" enctype="multipart/form-data">


...
</form>

JS: (in $(document).ready at bottom of page)

    $('#item_form').validate(
    {
        submitHandler:function(form)
        {
            $.post('http://phppos/.PHP-Point-Of-Sale-Prev/index.php/items/check_duplicate', {term: $('#name').val()},function(data) {
            {
                doItemSubmit(form);
            }} , "json")
             .error(function() 
             {
             });
        },
        errorClass: "text-danger",
        errorElement: "span",
            highlight:function(element, errorClass, validClass) 
            {       
                $(element).parents('.form-group').removeClass('has-success').addClass('has-error');
            },
            unhighlight: function(element, errorClass, validClass) 
            {
                $(element).parents('.form-group').removeClass('has-error').addClass('has-success');
            },
        rules:
        {
            "locations[1][quantity]":
            {
                number: true
            },
            "locations[1][reorder_level]":
            {
                number: true
            },
            "locations[1][cost_price]":
            {
                number: true
            },
            "locations[1][unit_price]":
            {
                number: true
            },          
            "locations[1][promo_price]":
            {
                number: true
            },          
            name:"required",
            category:"required",
            cost_price:
            {
                required:true,
                number:true
            },

            unit_price:
            {
                required:true,
                number:true
            },
            promo_price:
            {
                number: true
            },
            reorder_level:
            {
                number:true
            },
        },
        messages:
        {           
                "locations[1][quantity]":
                {
                    number: "This field must be a number"               
                },
                "locations[1][reorder_level]":
                {
                    number: "This field must be a number"               
                },
                "locations[1][cost_price]":
                {
                    number: "This field must be a number"               
                },
                "locations[1][unit_price]":
                {
                    number: "This field must be a number"               
                },          
                "locations[1][promo_price]":
                {
                    number: "This field must be a number"               
                },      
            name:"Item Name is a required field",
            category:"Category is a required field",
            cost_price:
            {
                required:"Cost Price is a required field",
                number:"Cost price must be a number"            
            },
            unit_price:
            {
                required:"Selling Price is a required field",
                number:"Unit price must be a number"            
            },
            promo_price:
            {
                number: "This field must be a number"           
            }
        }
    });
});

var submitting = false;

function doItemSubmit(form)
{
    if (submitting) return;
    submitting = true;
    $("#form").mask("Please wait...");
    $(form).ajaxSubmit({
    success:function(response)
    {
        $("#form").unmask();
        submitting = false;
        gritter(response.success ? "Success" +' #' + response.item_id : "Error" ,response.message,response.success ? 'gritter-item-success' : 'gritter-item-error',false,false);

        if(response.redirect==1 && response.success)
        { 
            if (response.sale_or_receiving == 'sale')
            {
                $.post('http://phppos/.PHP-Point-Of-Sale-Prev/index.php/sales/add', {item: response.item_id}, function()
                {
                    window.location.href = 'http://phppos/.PHP-Point-Of-Sale-Prev/index.php/sales'
                });
            }
            else
            {
                $.post('http://phppos/.PHP-Point-Of-Sale-Prev/index.php/receivings/add', {item: response.item_id}, function()
                {
                    window.location.href = 'http://phppos/.PHP-Point-Of-Sale-Prev/index.php/receivings'
                });
            }
        }
        else if(response.redirect==2 && response.success)
        {
            window.location.href = 'http://phppos/.PHP-Point-Of-Sale-Prev/index.php/items'
        }

      },
        dataType:'json'
   });
}
Chris Muench
  • 17,444
  • 70
  • 209
  • 362
  • Do those users have javascript enabled? – Jack Apr 23 '15 at 16:07
  • Yes they do have js enabled – Chris Muench Apr 23 '15 at 16:07
  • Side-note: your code is harder to read because it's formatted very inconsistently, mixing together Allman and 1TBS styles. Please read this: http://stackoverflow.com/q/11247328/594235 – Sparky Apr 23 '15 at 16:12
  • I was trying to clean it up but some of it was generated by php. I will try again – Chris Muench Apr 23 '15 at 16:13
  • That's even worse. Allman style can break JavaScript in certain circumstances and it's not typically how JavaScript is formatted. Read the link in my last comment. – Sparky Apr 23 '15 at 16:17
  • You have an `if/else if` statement. Is there a chance neither of those conditions are met? Also I'd check that php function and make sure there isn't a chance for it to just return the same view with json data if something fails. – Jack Apr 23 '15 at 16:17
  • I can state that it's very unlikely this problem has anything to do with the jQuery Validate plugin. As long as you have a custom `submitHandler` that does not contain a `.submit()`, the default form `action` is always totally blocked. Your problem is likely external to this plugin. – Sparky Apr 23 '15 at 16:21
  • @Jack Those conditions will always be met. – Chris Muench Apr 23 '15 at 16:22
  • @Sparky Do you have any ideas on where I can start looking? – Chris Muench Apr 23 '15 at 16:22
  • No, I don't. However, be aware that when you use `ajax` in general, ***ANY*** thing that disrupts the JavaScript can result in the form's default `action`. Just remove the `action` attribute from the `
    ` tag and see what happens instead. Maybe it's a timing issue that will be resolved by staying on the page. I only use an `action` attribute precisely in case the JavaScript fails. If your `action` attribute is not good enough as standalone, then it's pointless... you don't even use your `action` URL within the Ajax.
    – Sparky Apr 23 '15 at 16:39
  • ajaxSubmit uses the form action so that is kind of tricky – Chris Muench Apr 23 '15 at 16:52
  • Then that's where I'd focus all my efforts... on the `ajaxSubmit` plugin. Not really sure why you need a plugin for this though. jQuery `.ajax()` can just be used directly without too much trouble. – Sparky Apr 23 '15 at 17:09
  • @Sparky the nice part about ajaxSubmit is it sends all the form data and even takes care of image uploads via ajax – Chris Muench Apr 23 '15 at 17:59
  • Are you uploading any images here? And jQuery `.serialize()` is all you need for collecting the form data. My comment was just a suggestion that will simplify your code enough to hopefully make it more reliable and/or solve your issue. This is why these kinds of open ended questions are not really seen much here... they lead to endless guessing and suggestions in comments without any solid answers being posted. – Sparky Apr 23 '15 at 18:06
  • @Sparky Yeah I am using images on this form. I was hoping someone could spot a problem and at least get me going in the right direction. I know this is a difficult question – Chris Muench Apr 23 '15 at 18:11
  • FWIW, from what I can see, you're using both plugins correctly. Good luck. – Sparky Apr 23 '15 at 18:15

0 Answers0