使用Ajax将表单数据发布到ZF2控制器

Question

编辑 -
我已经在下面发布了答案.

问题是,当按下提交按钮时,我不明白ZF2在何处/何处发布表单数据.所以,当我
if ($this->getRequest()->isPost()){
在下面的ajax调用之后执行时,它告诉我没有发布任何数据.

当我执行上面的isPost()if语句时,当我点击提交按钮,告诉我数据已经发布并随后告诉我表单数据有效时,它可以正常工作.

这是ajax电话 -

            <script>
                $.ajax({
                    url: urlform,
                    type: 'POST',
                    dataType: 'json',
                    contentType: "application/json; charset=utf-8",
                    async: true,
                    data: ($("#newThoughtForm").serialize() + '&submit=go'),
                    success: function () {
                        console.log('SUBMIT WORKS');
                        setTimeout(function () { <?php echo $this->invokeIndexAction()->test(); ?> ;
                        }, 1000);
                    },
//This keeps getting executed because there is no response, as the controller action is not run on a Post()
                    error: function () {
                        console.log('There is error while submit');
                        setTimeout(function () { <?php echo $this->invokeIndexAction()->test(); ?> ;
                        }, 1000);
                    }
//I assume the data won't get pushed to the server if there is no response,
//but I can't figure out how to give a response in ZF2 since the controller is not
//run when the Post() is made. 
                });

这是表格 -

            use Zend\Form\Form;

            class newAlbumForm extends Form
            {
                public function __construct()
                {
                    parent::__construct('newAlbumForm');
                    $this->setAttribute('method', 'post');

                    $this->add(array(
                        'type' => 'AlbumModule\Form\newAlbumFieldset',
                        'options' => array(
                            'use_as_base_fieldset' => true
                        )
                    ));

                    $this->add(array(
                            'name' => 'submit',
                                'attributes' => array(
                                    'type' => 'submit',
                                    'value' => 'go'
                        ),
                    ));
                }
            }

请求ajax调用 -

            Request URL:http://test/newAlbum.html
            Request Method:POST
            Status Code:200 OK
            Request Headersview source
            Accept:*/*
            Accept-Encoding:gzip,deflate,sdch
            Accept-Language:en-US,en;q=0.8
            Connection:keep-alive
            Content-Length:46
            Content-Type:application/x-www-form-urlencoded; charset=UTF-8
            Cookie:PHPSESSID=h46r1fmj35d1vu11nua3r49he4
            Host:test
            Origin:http://test
            Referer:http://test/newAlbum.html
            User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36
            X-Requested-With:XMLHttpRequest
            Form Dataview sourceview URL encoded
            album[albumText]:hello world
            submit:go
            Response Headersview source
            Connection:Keep-Alive
            Content-Length:4139
            Content-Type:text/html
            Date:Sun, 20 Oct 2013 16:52:15 GMT
            Keep-Alive:timeout=5, max=99
            Server:Apache/2.4.4 (Win64) PHP/5.4.12
            X-Powered-By:PHP/5.4.12

提交按钮的请求 -

            Request URL:http://test/newAlbum.html
            Request Method:POST
            Status Code:200 OK
            Request Headersview source
            Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
            Accept-Encoding:gzip,deflate,sdch
            Accept-Language:en-US,en;q=0.8
            Connection:keep-alive
            Content-Length:46
            Content-Type:application/x-www-form-urlencoded
            Cookie:PHPSESSID=h46r1fmj35d1vu11nua3r49he4
            Host:test
            Origin:http://test
            Referer:http://test/newAlbum.html
            User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36
            Form Dataview sourceview URL encoded
            album[albumText]:hello world
            submit:go
            Response Headersview source
            Connection:Keep-Alive
            Content-Length:4139
            Content-Type:text/html
            Date:Sun, 20 Oct 2013 16:52:14 GMT
            Keep-Alive:timeout=5, max=100
            Server:Apache/2.4.4 (Win64) PHP/5.4.12
            X-Powered-By:PHP/5.4.12

这是控制器上的indexAction()的完整性 -

            public function indexAction()
            {
                echo 'console.log("Index Action is Called");';

                $form = new \AlbumModule\Form\newAlbumForm();
                if ($this->getRequest()->isPost()){
                    echo 'console.log("Data posted");';

                    $form->setData($this->getRequest()->getPost());
                    if ($form->isValid()){
                        echo 'console.log("Form Valid");';

                        //todo
                        $this->forward()->dispatch('newAlbum', array('action' => 'submitAlbum'));
                        return new ViewModel(
                            array(
                                    'form' => $form
                            )
                        );
                    } else {
                        echo 'console.log("Form Invalid");';

                        return new ViewModel(
                            array(
                                    'form' => $form
                            )
                        );
                    }
                } else {
                    echo 'console.log("No data posted")';
                    return new ViewModel(
                            array(
                                    'form' => $form
                            )
                        );
                }
            }

正如我在开头所说,isPost()当按钮提交表单时,类将返回true值,但是当通过Ajax提交表单时,它将返回false值.

编辑 -
我已经在下面发布了答案.

Answer 1

通常,当您从ajax发送数据时,您不需要再次渲染模板,这就是ViewModel所做的.

尝试将json策略添加到module.config.php中

'view_manager' => array(
    //other configuration
    'strategies' => array(
        'ViewJsonStrategy',
    ),
),

然后你的行动应该是这样的:

public function ajaxAction()
{
    $request = $this->getRequest();

    if ($request->isXmlHttpRequest()){ // If it's ajax call
        $data = $request->getPost('data'));
        ...
    }


    return new JsonModel($formData);
}