3

I am currently trying to validate a zend form with ajax and zend validate at the same time...

Let me explain, my forms pops up in an iframe (fancybox) and when submitted, I need to display a "thank you" message, close the iframe and redirect the user. I planned to use ajax validation to close the fancybox iframe if success.

I followed several tutorials http://www.zendcasts.com/ajaxify-your-zend_form-validation-with-jquery/2010/04/ explaining how to ajaxify your zend form to display errors for instance onblur event on a textinput.

Everything works find onblur or over events but when I specify the click event on the submit button, my guess is that the form gets processed by zend and ajax validation doesn't work... Do you have any hints or do you see obvious mistakes?? thanks a lot.... the javascript:

$(function()
    {
    $('#contact').submit(function()
    {
        doValidation();                 
    });

});

function doValidation()
{
    var url = '/ceramstar/public/contact/validateform';
    var data = {};
    $("input").each(function(){
            data[$(this).attr('name')] = $(this).val();

    });


    $.post(url,data,function(resp)
        {
        //document.write(resp);

                    console.log(resp);
                    alert(resp);
                    //parent.$.fancybox.close();



        },"json");
}

the zend action:

public function validateformAction()
{

    $this->_helper->viewRenderer->setNoRender();
    $this->_helper->layout->disableLayout();
    $form = new Form_ContactForm();

    $form->isValidPartial($this->_getAllParams());
    //print_r($bool);
    $json = $form->processAjax($this->getRequest ()->getPost ());
    header('Content-type: application/json');
    echo Zend_Json::encode($json);
}
S L
  • 14,262
  • 17
  • 77
  • 116
user698812
  • 53
  • 2
  • 6
  • what response do you get in your firebug console?? – S L Apr 11 '11 at 11:13
  • 2
    Not sure, but shouldn't you preventDefault behaviour of your submit button? – Marcin Apr 11 '11 at 11:27
  • when i use another event like "hover", i'm getting the correct response which is the json object with the errors when a field is blank or empty when everything is fine. But when using click or submit event, I just get an empty POST http://...... error with nothing inside – user698812 Apr 11 '11 at 11:59
  • the prevent default works good the ajax validation is done but now i can't submit the form :) – user698812 Apr 11 '11 at 12:20
  • What do you mean with "i can't submit the form" you actually submitted it for validation or do you mean you can't dismiss the form? – DarkLeafyGreen Apr 11 '11 at 12:37
  • I mean the zend real validtion doesn't occur as the javascript ajax "fake validation" (to close the fancybox) stops the process. I guess I should maybe not use a separate form/action or do everything with ajax... Thanks – user698812 Apr 11 '11 at 12:43
  • ok I found a way which might not be the prettiest but seem to work:$.post(url,data,function(resp) { //document.write(resp); console.log(resp); alert(resp); //parent.$.fancybox.close(); $('#contact').submit(); },"json"); – user698812 Apr 11 '11 at 13:01
  • you can use $this->_helper->json($json); instead of header('Content-type: application/json'); echo Zend_Json::encode($json); – MiPnamic Apr 11 '11 at 15:03

1 Answers1

1

You should return false or preventDefault on the .submit

(function() {
    $('#contact').submit(function() {
        doValidation();
        return false;
    }
});
Jarsäter
  • 338
  • 3
  • 9
  • yes you're right, I found a way which might not be the prettiest but seem to work:$.post(url,data,function(resp) { //document.write(resp); console.log(resp); alert(resp); //parent.$.fancybox.close(); $('#contact').submit(); },"json"); – user698812 Apr 11 at 13:01 – user698812 Apr 20 '11 at 06:33