zend-framework - Zend_Form 与 Ajax/json

Question

将 Zend_Form 与 Ajax 一起使用，我有点迷失了。我在一个扩展 Zend_Form 的类中有一个表单，它从我的控制器调用，这样：

GoodAddGroup.php

class Default_Form_GoodAddGroup extends Zend_Form {
    (...)

    public function init()
    {
        $this->setMethod('post');
        $this->setAction("process-add-group");
        $this->setName("addgroupgood");

        // Load Elements class
        require "Form/Elements.php";
        $magElements = new Elements();

        // Category
        $categoryElement = $magElements->getCategorySelectField();
        $categoryElement->setDecorators($this->elementDecorators);

        // Barcode
        $barcodeElement = $magElements->getGoodBarcodeTextField();
        $barcodeElement->setDecorators($this->elementDecorators);

        (...)

        // Add elements to the form
        $this->addElements(array(
            $categoryElement,
            //$codeElement,
            $barcodeElement,
            $serialElement,
            $warehouseElement,
            $submitButtonElement
        ));
        $this->setDecorators($this->formDecorators);
    }
}

在GoodsController.php 中

private function getAddGroupForm()
{
    return new Default_Form_GoodAddGroup();
}

public function addGroupAction()
{
    // Initialize the form for the view.
    $this->view->form = $this->getAddGroupForm();
}

public function processAddGroupAction()
{

        $form = $this->getAddGroupForm();
    (...)

    if ($_POST)
    {
        if ($form->isValid($_POST))
        {
            // Do things
        } else {
            $this->view->form = $form;
        }
    }
}

Basically, the form has a category select field, when selecting a category, a second "code" selector is added filled with the items related to this category. 当显示带有表单的页面 (http://myapp/goods/add-group) 时，一切正常，ajax 调用完成了它的工作，第二个选择字段被添加并很好地输入，但是正如你所看到的，表单处理是通过 processAddGroupAction() 完成的，该方法获取表单的实例以获取其值并在出现问题时重新显示它。但是那样，我的“新”选择字段不再存在，所以我永远无法验证表单。

这是我第一次尝试在 Zend 中使用 ajax/json，我想我需要帮助。

谢谢你。

编辑：按要求添加视图代码

<script>
    $(function(){
        $("#cats").change(function(){
            getSelectBox(this);
        });

        $("#code").parent().parent().css('display', 'none');
        getSelectBox($("#cats"));
    });

    function getSelectBox(element)
    {
        if($(element).val() != '')
        {
            $("#code").parent().parent().css('display', 'block');
            if ($('#code').length <= 0) {
                $("#cats").after('<select name="code" id="code" style="margin-left:10px"></select>');
            }
            $.getJSON("/goods/json-get-codes-from-category", {id: $(element).val(), ajax: "true"}, function(j){
                console.log(j);
                var options = "";
                jQuery.each(j, function(i, val) {
                    options += '<option value="' + i + '">' + i + val + '</option>';
                });
                $("#code").html(options);
            });
        }
    }
</script>

<?php echo $this->form; ?>

score 1 · Accepted Answer

您可以在表单中添加选择元素“代码”，但不要在视图中显示（它将从 js 创建）。因此，当表单发布时，“代码”也将被验证，因为它位于 $_POST 中。
发布后，您必须显示不带 $("#cats").change({..}). 您可以通过将 js 代码吐到函数中来完成它

<script>
    $(function(){
        $("#cats").change(function(){
            getSelectBox(this);
        });

        getSelectBox($("#cats"));
    });

    function getSelectBox(element)
    {
        if($(element).val() != '')
        {
            if ($('#code').length <= 0) {
                $("#cats").after('<select name="code" id="code" style="margin-left:10px"></select>');
            }
            $.getJSON("/goods/json-get-codes-from-category", {id: $(element).val(), ajax: "true"}, function(j){
                console.log(j);
                var options = "";
                jQuery.each(j, function(i, val) {
                    options += '<option value="' + i + '">' + i + val + '</option>';
                });
                $("#code").html(options);
            });
        }
    }
</script>

希望这可以帮助

score 0 · Accepted Answer

好的，我找到了解决方案！我发布它以防它对其他人有用。我知道问题出在哪里，但不知道如何解决。

在表单处理时，该操作不存在新的选择元素，因为它已使用 javascript 添加到视图中。为了解决这个问题，我们需要通知动作关于新字段，为此，我们首先需要在表单类中覆盖 Zend_Form 的方法“isValid”：

public function isValid($values)
{
    $values = $this->_modifyElements($values);   
    return parent::isValid($values);
}

然后创建一个方法“_modifyElements”，通过添加新元素来修改表单：

protected function _modifyElements($values)
    {
        // Search for codes
        $dbu = new DbUtils();
        $codes = $dbu->getCodesFromCategory($values['cats']);

        // Remove the current code element
        $this->removeElement('code');

        // Create a new element
        $codeElement = new Zend_Form_Element_Select('code', array());
        $codeElement->setLabel(_('Code :'));
        $codeElement->setRequired(true);
        $codeElement->addMultiOptions($codes);
        $codeElement->setValue($values['code']);
        $codeElement->setDecorators($this->elementDecorators);
        $this->addElement($codeElement);

        return $values;
    }

我们也必须重写方法“populate”：

public function populate(array $values)
{
    $values = $this->_modifyElements($values);   
    return parent::populate($values);
}

瞧。它对我有用；> 所有关于此的功劳都归 Mohamed：http: //jamandcheese-on-phptoast.com/2009/12/13/on-fly-elements-in-zend_form/

zend-framework - Zend_Form 与 A​​jax/json

2 回答 2

Related

Reference

zend-framework - Zend_Form 与 Ajax/json