如何通过按Enter键发送带有Dojo和XHR的Zend表单

时间:2013-05-23 18:16:40

标签: forms zend-framework dojo xmlhttprequest enter

首先,我使用的东西:
我正在使用Dojo 1.6和Zend Framework 1.11.5 - 不,我现在不会更新。

第二,我的情况:
我有一个启用了Zend_Dojo支持的Zend_Form。 我正在我的动作控制器中创建公式,并将其提供给完美呈现的视图。 formular调用一个javascript函数,它将变量放入一个URL,用于更新内容窗格。

第三次,我的问题:
按[ENTER]时不会发送公式,仅在单击按钮时发送。

第四,我的代码:
遗漏了注释,代码变得更简单,更易于阅读。有些部分遗失了。

这是我的Zend_Form / _Dojo的一部分:

/application/forms/CommunityDeviceFinderForm.php

class CommunityDeviceFinderForm extends Zend_Form {

public function init(){
    Zend_Dojo::enableForm($this);

    $this->setMethod('post');
    $this->setAttribs(array(
        'name' => 'findDeviceForm'
    ));
}

public function createElements(){
    // some $this->addElement here

    $this->addElement(
        'Button',
        'submitDeviceSearch',
        array(
            'label'    => tr_('Search'),
            'required' => false,
            'ignore'   => true,
            'onClick'  => 'findDevice()'  // the called javascript function
        )
    );

我遗漏了我的控制器。它只是创建公式并将其赋予视图(如“$ deviceSearchForm”)。

我的观点脚本。也缩短了很多:

/application/modules/default/views/scripts/default/de/community/device-finder.phtml

<script>
    function findDevice(){
        var formular = dijit.byId('<?=$this->deviceSearchForm->getAttrib('name')?>');

        if(formular.isValid()){
            // collecting form vars and creating an URL
            // then refreshing a content pane with the created URL
        } else {
            // error shown
        }
    }
</script>

<!-- some html -->

        <?=$this->deviceSearchForm?>

<!-- some more html -->

我想 - 或者知道 - 问题是“按钮”不是“SubmitButton”。但我不想刷新页面。如何将onSubmit之类的东西连接到公式?收听事件并阻止默认操作。而是调用我的findDevice()js-function。

我不能自己听按键,因为几乎完全没有按键,它就在它旁边,这对它自己来说很有用。

我喜欢这样的东西:将属性namend“onSubmit”添加到formular attributes数组,该数组链接到js-function findDevice()。

抱歉我的英语不好:(

非常感谢!
-Philipp

2 个答案:

答案 0 :(得分:1)

尝试将onsubmit事件设置为您的表单,如下所示:

$this->setAttribs(array(
    'name' => 'findDeviceForm',
    'onSubmit' => 'findDevice(); return false;'
));

然后在提交时调用findDevice()函数并返回“return false;” part会阻止实际的提交/页面刷新。

答案 1 :(得分:0)

我和我的一位朋友找到了解决方案 - 上面的答案。现在这是完整的代码。

将“ findDevice();返回false; ”作为“ onSubmit ”添加到zend公式的属性中。 然后调用函数findDevice()。 “回归虚假”;阻止它做通常的事情,比如刷新。

此外,无需再覆盖提交按钮的onClick事件。

所以这是代码。视图脚本保持不变。

/application/forms/CommunityDeviceFinderForm.php

class CommunityDeviceFinderForm extends Zend_Form {

    public function init(){
        Zend_Dojo::enableForm($this);

        $this->setMethod('get')
             ->setAttribs(array('name'     => 'findDeviceForm',
                                'onSubmit' => 'findDevice(); return false;'));
    }

    public function createElements(){

        // [...]

        $this->addElement(
            'SubmitButton',
            'submitDeviceSearch',
            array('label'    => tr_('Search'),
                  'required' => false,
                  'ignore'   => true));

        // [...]
    }
}

感谢您的帮助!