Question

在几页上，我需要包含一个方框和一个提交按钮。视图文件使用DatePicker允许用户填写输入框。点击“开始”（提交）按钮后，我会根据日期更改以下内容。

我目前正在尝试使用小部件，因为此代码将用于多个页面。我现在的问题是我想知道如何从表单中获取POST请求并使用它。我需要一个模型吗？我将在下面附上我当前的代码，但是现在我收到的错误是$ date未定义。我知道它会给出错误，但我对于我究竟需要做些什么感到困惑。

小部件的当前代码：

/protected/views/dateWidget.php

<div class="form">

    <?php $form=$this->beginWidget('CActiveForm', array(
            'id'=>'date-form',
            'enableAjaxValidation'=>false,
            'enableClientValidation' => true,
)); ?>

    <p class="note">
        Fields with <span class="required">*</span> are required.
    </p>

    <?php echo $form->errorSummary($date); ?>

    <div class="row">
        <?php echo $form->labelEx($date,'date'); ?>
        <?php
        $this->widget('zii.widgets.jui.CJuiDatePicker', array(
                'model' => $model,
                'attribute' => 'date',
                'language' => 'ja',
                'i18nScriptFile' => 'jquery.ui.datepicker-ja.js',
                'options' => array(
                    'showOn' => 'both',             // also opens with a button
                    'dateFormat' => 'yy-mm-dd',     // format of "2012-12-25"
            ),
            'htmlOptions' => array(
                'size' => '10',         // textField size
                'maxlength' => '10',    // textField maxlength
            ),
        ));
        ?>
        <?php echo $form->error($date,'date'); ?>
    </div>

    <div class="row buttons">
        <?php echo CHtml::submitButton('Add'); ?>
    </div>

    <?php $this->endWidget(); ?>

</div>
<!-- form -->

/protected/components/DateWidget.php

<?php 
class DateWidget extends CWidget
{
    /**
     * @var CFormModel
     */
    public $form;

    public function run()
    {
//      if (! $this->form instanceof CFormModel) {
//          throw new RuntimeException('No valid form available.');
//      }
        $this->render('application.views.dateWidget', array('form'=>$this->form));
    }
}
?>

问题是：我如何使用DateForm中的$ _POST来影响其他视图/模型。

Answer 1

根据所选日期，您想要更改哪些数据并不明确，因为$form视图中的dateWidget.php变量不明确。开始日期的表单小部件（例如$form = $this->beginWidget('CActiveForm', array(...))）替换CFormModel实例传递的DateWidget实例。这就是令人困惑的......您是否希望将CActiveForm的日期字段用作其他表单的一部分或作为单独的嵌套表单？

无论如何，要在表单提交之前更改任何数据，可以将DateWidget处理程序附加到该表单：

onSubmit

考虑到嵌套表单的更一般情况并假设视图中jQuery('#date-form').submit(function(event) { // Any actions before submission }是$form实例，我们可以在视图脚本的末尾注册以下脚本（或者在单独的JS文件中您的CActiveForm - 以您喜欢的任何方式），如下所示。

请注意，您必须编写自己的JavaScript函数DateWidget（将收集主窗体的字段值并将它们放在生成的纯JavaScript对象中）和collectFormData（这将设置新的值田野）。这是因为populateFormData的某些字段是自定义的，并且包含多个输入元素（例如复选框或单选按钮列表）。您可以将这些函数放在窗口小部件的单独JS文件中。

另外，要使CActiveForm适用于包含任何数据的任何表单，我们使用代码片段对其进行限制，这些代码片段会更改表单的数据，将这些片段移动到可由DateWidget $url属性引用的单独PHP脚本中。 1}}。

DateWidget

更改表单数据的PHP脚本必须将结果返回为JSON：

Yii::app()->clientScript->registerScript("alterPost", "
    jQuery('#" . $form->id . "').submit(function(event, submit) {

        // Checking whether form's submission has been requested
        if (submit) {

            // Allowing form submission
            return;
        }

        // Preventing form submission
        event.preventDefault();
        event.stopPropagation();

        // Getting selected date
        var dateString = jQuery(this).find('input[name$=\"[date]\"]').val();

        // Collecting data of main form...
        var jqMainForm = jQuery(this).parents('form');
        var mainFormData = collectFormData(jqMainForm.attr('id'));

        var self = jQuery(this);
        jQuery.ajax('" . $this->url . "', {
            'type': 'POST',
            'data': jQuery.extend({'dateString': dateString}, mainFormData),
            'dataType': 'json',
            'success': function(data, textStatus, jqXHR) {

                // Populating main form by new values
                if (data['result'] === true)
                    populateFormData(jqMainForm.attr('id'), data['alteredFormData']);
                self.trigger('submit', true);
            }
        });
    })
", CClientScript::POS_READY);

使用允许POST请求的表单创建窗口小部件

1 个答案: