Zend форма в диалоге dijit при подтверждении отправки - PullRequest
0 голосов
/ 19 сентября 2011

Я довольно новичок в создании веб-приложения и хотел бы обратиться за помощью в отношении dojo и zend framework.У меня проблемы с проверкой при отправке формы, а также необходимо создать динамический элемент при нажатии кнопки внутри формы (добавить кнопку нового модератора).

Что мне нужно:
  • Всплывающее диалоговое окновверх, который включает в себя Zend-форму.
  • Форма должна иметь проверку.
  • Форма должна создавать динамический текстовый элемент при нажатии «новый модератор».
  • При отправке формы,

    If an error occurs during validation show the errors on the 
         popped up dialog and let user fix the error. 
    On success redirect the user to the parent page that calls the popup dialog.
    
То, что у меня есть сейчас:
  • Форма, в которую я помещаю проверки при создании элемента.
  • Элемент представления, в котором есть декларативный диалог dijit, гдеЯ «повторил» форму zend.
  • Кнопка, которая запускает и показывает диалоговое окно dijit.
  • Контроллер, который проверяет данные формы и добавляет ошибки формы, если таковые имеются.
Проблема
  • Проверка набора при создании элемента не запускается и отображается в форме.
  • Где и как добавить создание нового элемента при нажатии кнопки «новый модератор».

Вот мой урезанный код:

Форма
class Form_Test
{
    public $processed = false;

    public function init()
    {
        parent::init();
        $this->setAttribs(array('name'=>'test'));
        $this->setAction('/myapp/new')->setMethod('

        $this->addElement('ValidationTextBox', 'topic', array(
            'label'      => 'Topic: ',
            'required' => true,
            'trim'       => true, 
            'validators'  => array("alnum"),
            'filters' => array(new Zend_Filter_StringToLower(),
        new Zend_Filter_StringTrim()
        )
        )
        );
        $this->addElement('SimpleTextArea', 'desc', array(
            'label'      => 'Description: ',
            'trim'       => true
        )
        );
        $this->addElement('ValidationTextBox', 'moderator', array(
            'label'      => 'Moderator: ',
            'required' => true,
            'trim'       => true, 
            'validators'  => array("EmailAddress"),
            'filters' => array(new Zend_Filter_StringToLower(),
        new Zend_Filter_StringTrim()
        )
        )
        );


        $this->addElement('SubmitButton', 'submit', array(
            'label' => 'Create'
        ));
    }
}
Вид
<button class="myButton" type="button" onclick="dijit.byId('formDialog').show()">
    New Topic
</button> 

<div dojoType="dijit.Dialog" id="formDialog" title="Topic" style="width:500px; height:300px;">
    <?php echo $this->form; ?>
</div>
Контроллер
public function newAction()
    {

        $form= new Form_Test();
        $this->view->form = $form;
        $form->submit->setLabel('Create');
        $values = $form->getValues();

        if( $this->_request->isPost())
        {
            if($form->isValid($_POST)){        
                $topic = new Application_Model_Topic();
                $result = $topic->createNewTopic($_POST);
                if($result == false){
                   $form->addError($result->error);
                }
            }
        }
        $this->view->form = $form;
        // How to redirect to form if there's error?

        $this->_redirect('/myapp/index');
    }

Я видел пост с созданием динамического элемента, который использует ajax, но это не такиспользуя диалоговое окно dijit в форме и в основном в jquery, где у меня также нет никакого фона.

Я уже искал в сети, но безрезультатно.Пожалуйста, помогите мне.Заранее спасибо.

1 Ответ

1 голос
/ 08 октября 2011

Я наконец-то решил это! смотрите ниже ... Надеюсь, это поможет тому, кто столкнется с теми же проблемами. Если у вас есть более элегантные решения, просто оставьте свои здесь.

Обработка форм внутри диалогового окна dijit

Проверка при создании элемента не запускается и отображается в форме.

  1. Добавьте элемент div, который будет содержать ошибки в диалоге dijit перед отображением формы.

    View

    <div dojoType="dijit.Dialog" id="formDialog" title="Topic" style="width:500px height:300px;">
        <div id='form-holder' style="overflow: auto; height: 250px;">
            <div id='errors' class='errors'></div>   
            <?php echo $this->form; ?>
        </div>
    </div>
    
  2. При отправке формы вызывайте контроллер через xhrpost и ни на что не перенаправляйте. Прежние ошибки для Zend будут заполнены ошибками. (У меня есть контроллер, вернувший статус успеха / неудачи)
  3. Извлечь прежние ошибки Zend, отформатировать их и добавить к созданному элементу div.

    View

    var xhrArgs = {url: "your controller action",
           form: dojo.byId("your form"),
           handleAs: "json",
           load: function(data) {
                if(data['success']==false){
                     destroyErrorList(); //will remove errors previously set
                     dojo.place(formatError(data['error']),
                                       dojo.byId("errors"),'last');
                }else{
                     // on success redirect back to the page
                     window.location = "redirect url";
                }
           },
           error: function(error) {
                 console.log(error);
           }
      };
      dojo.xhrPost(xhrArgs);
    

Где и как я буду добавлять создание нового элемента при нажатии кнопки «новый модератор».

  1. Добавьте в форму скрытое поле, которое будет содержать «идентификатор модератора»

    Форма

    $this->addElement('hidden', 'id', array('value' => 1);
    
  2. Добавьте функцию preValidation к вашей форме, которая будет использоваться позже при отправке формы согласно (http://www.jeremykendall.net/2009/01/19/dynamically-adding-elements-to-zend-form/) blogpost.

    Форма

    public function preValidation(array $data) {
       // Search $data for dynamically added fields using findFields callback
       foreach ($newFields as $fieldName) {
       // strip the id number off of the field name and use it to set new order
       }
    }
    
  3. onClick Действие кнопки «новый модератор» возвращает скрытый идентификатор и динамически создает новое текстовое поле для добавления электронного письма модератору.

    View

    function addModeratorField() {
        var id = parseInt(dojo.byId("id").value);
        var newTextBox =  new dijit.form.TextBox({id:'moderator_'+id, name:'moderator_'+id});
        dojo.byId("moderators_holder").appendChild(newTextBox.domNode);
        dojo.parser.parse(dojo.byId('moderator_'+id));//dijitize the textbox
    
        // Increment and store id
        dojo.byId("id").value = parseInt(id) + 1;
    }
    
  4. На вашем контроллере, когда форма отправляется перед выполнением каких-либо действий с почтовыми данными

    Контроллер

    // Form has been submitted - run data through preValidation() to populate the new fields
    $form->preValidation($_POST);
    if($form->isValid($_POST)){//do something}
    
...