2

I have the following method in my template file:

function submit_serials(){
    var serials = $('serials').value;
    new Ajax.Request("<?php echo $this->getUrl('*/*/process'); ?>" + '?serials=' + serials, {
        method: 'POST', 
        onComplete: function(transport) {
            div = $('feedback');
            div.update(transport.responseText);
        }
    });
}

in my controller file I have:

public function processAction(){
    $serials = $_POST['serials'];
    ...
}

I'm getting a Request-URI too large error. I understand that there is too much info being stored in the serials variable, but how else can I parse this through to the controller? I read that you should be using the body of the AJAX request but I can't seem to figure out how to do so.

How can I parse the serials in the body of this Ajax request & fetch them from within the controller file?

2
  • You are trying to send data in GET while using POST request... Send it in POST.
    – Amberta
    Commented Jan 30, 2015 at 13:23
  • If you could elaborate on how to do so, I'd really appreciate it :-)
    – Moose
    Commented Jan 30, 2015 at 13:24

2 Answers 2

4

You need form param serialize, and send form fields as it as param to ajax request

 new Ajax.Request(url,{
    method:'POST',
parameters:params,
    requestHeaders: {Accept: 'application/json'},
    onSuccess:function(transport){
        var response=transport.responseText.evalJSON(true);

    }.bind(this)
    });

If you work with varien form stucture then using form ID you can create Varien form vaidation:

//<![CDATA[
        var MobileLogin = new VarienForm('min-mobile-login', true);
            MobileLogin.submit = function(button, url) {
            if (this.validator.validate()) {
                var form = this.form;
                var oldUrl = form.action;
                if (url) { form.action = url; }
                var e = null;
                try { 
            //this.form.submit();
            //loggin(this.form.action,this.form.serialize(),this.form.method);

            new Ajax.Request(this.form.action,{
            method:'POST',
            parameters:this.form.serialize(),
            requestHeaders: {Accept: 'application/json'},
            onSuccess:function(transport){
                var response=transport.responseText.evalJSON(true);

            }.bind(this)
            });


        } catch (e) {
                }
                this.form.action = oldUrl;
                if (e) { throw e; }


            }
        }.bind(MobileLogin);
    //]]>

Here min-mobile-login is id form .Ex <form id="min-mobile-login" ....

And form button type should be submit and it content onclick function and and return false

    <button class="button" type="submit"  
onclick="MobileLogin.submit(this); return false;">Login</button>
3
  • Thanks a lot for the info. Could you show me how to specify the parameters for the serials variable? Sorry, not very familiar with Ajax at all!
    – Moose
    Commented Jan 30, 2015 at 13:29
  • of course... it will give full solution just hold
    – Amit Bera
    Commented Jan 30, 2015 at 13:30
  • you can also use transport.responseJSON if the backend script sends the Content-type: application/json header Commented Jan 30, 2015 at 19:06
4

http://prototypejs.org/learn/introduction-to-ajax

new Ajax.Request('/some_url', {
  method: 'post',
  parameters: {company: 'example', limit: 12}
});

Use Google more. There are many examples.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.