Yii - 错误(和可能的解决方案)验证表单,其中clientValidation处于活动状态,并使用自定义容器

时间:2013-07-25 07:53:48

标签: forms validation yii

我正在创建一个启用了ClientValidation的CActiveForm,但是当我将一个RadioButtonList包装在一个UL容器中时,我遇到了错误。

每当我提交表单时,即使检查了无线电,我也会收到“字段不能为空”的消息。

我的表格:

$form=$this->beginWidget('CActiveForm', array(
 'id'=>'enrollment-form',
 'enableClientValidation'=>true,

 'clientOptions'=>array(
     'inputContainer'=>'ul',
     'validateOnSubmit'=>true,
 ),
));

我使用的RadioButtonLists之一:

<div id="drinks">
  <?php echo $form->label($model,'drink_id',array('class' => 'title')); ?>                
  <?php echo $form->radioButtonList($model,'drink_id', CHtml::listData($drinks, 'id', 'name'), array('container'=>'ul', 'template' => '<li class="radio_row">{input}{label}</li>','separator' => '')); ?>                
  <?php echo $form->error($model,'drink_id'); ?>
</div>

我做错了吗?

我研究了jquery.yiiactiveform.js的代码,发现我的问题是在获取输入值的函数中,未正确采用值,因为用于标识输入的ID未设置在一个范围内,或在复选框/无线电本身(id在我定义的UL容器中设置):

var getAFValue = function (o) {
    var type,
        c = [];
    if (!o.length) {
        return undefined;
    }
    if (o[0].tagName.toLowerCase() === 'span') {
        o.find(':checked').each(function () {
            c.push(this.value);
        });
        return c.join(',');
    }
    type = o.attr('type');
    if (type === 'checkbox' || type === 'radio') {
        return o.filter(':checked').val();
    } else {
        return o.val();
    }
};

所以我解决了这个添加 || o [0] .tagName.toLowerCase()==='ul'

var getAFValue = function (o) {
    var type,
        c = [];
    if (!o.length) {
        return undefined;
    }
    if (o[0].tagName.toLowerCase() === 'span' || o[0].tagName.toLowerCase() === 'ul') {
        o.find(':checked').each(function () {
            c.push(this.value);
        });
        return c.join(',');
    }
    type = o.attr('type');
    if (type === 'checkbox' || type === 'radio') {
        return o.filter(':checked').val();
    } else {
        return o.val();
    }
};

也许我只是犯了一些错误,这个解决方案只是一个糟糕的解决方法......但也许这只是一个错误?

生成的HTML:

<form id="enrollment-form" action="/enrollment" method="post">
  <div style="display:none"><input type="hidden" value="b06e1d1d796f838f30ba130f8d990034aa9fdad6" name="YII_CSRF_TOKEN" /></div>    
  <div id="enrollment-form_es_" class="errorSummary" style="display:none"><p>Please fix the following input errors:</p>
    <ul><li>dummy</li></ul>
  </div>

  <div id="drinks">
    <label class="title" for="EnrollmentForm_drink_id">Drinks</label>                
    <input id="ytEnrollmentForm_drink_id" type="hidden" value="" name="EnrollmentForm[drink_id]" />

    <ul id="EnrollmentForm_drink_id">
      <li class="radio_row">
        <input id="EnrollmentForm_drink_id_0" value="2" type="radio" name="EnrollmentForm[drink_id]" />
        <label for="EnrollmentForm_drink_id_0">Tea</label>
      </li>
      <li class="radio_row">
        <input id="EnrollmentForm_drink_id_1" value="1" type="radio" name="EnrollmentForm[drink_id]" />
        <label for="EnrollmentForm_drink_id_1">Juice</label>
      </li>
    </ul>                
    <div class="errorMessage" id="EnrollmentForm_drink_id_em_" style="display:none"></div>
  </div>

我注意到如果我在生成RadioButtonList时没有使用任何容器,Yii对一个span应用“class = success”。使用我的UL容器,不会生成该类。当我更改了Javascript时,会再次生成类成功。

**生成的HTML没有inputContainer选项,没有radioButtonList中的最后一个数组:

<div id="drinks">
  <label class="title" for="EnrollmentForm_drink_id">Bebidas</label>                
  <input id="ytEnrollmentForm_drink_id" type="hidden" value="" name="EnrollmentForm[drink_id]">

  <span id="EnrollmentForm_drink_id">
    <input id="EnrollmentForm_drink_id_0" value="2" type="radio" name="EnrollmentForm[drink_id]"> <label for="EnrollmentForm_drink_id_0">Tea</label><br>
    <input id="EnrollmentForm_drink_id_1" value="1" type="radio" name="EnrollmentForm[drink_id]"> <label for="EnrollmentForm_drink_id_1">Juice</label>
  </span>                
 <div class="errorMessage" id="EnrollmentForm_drink_id_em_" style="display:none"></div>            
</div>

正如你所看到的,Yii生成一个奇怪的跨度来控制表单是否有效,方法是将它命名为“success”。如果我使用inputContainer UL,则不生成此class =“success”(使用我的解决方法生成它并且它可以工作)。

0 个答案:

没有答案