带有字段验证的 Yii ajaxSubmitButton()
Posted
技术标签:
【中文标题】带有字段验证的 Yii ajaxSubmitButton()【英文标题】:Yii ajaxSubmitButton() with fields validation 【发布时间】:2011-09-14 23:16:11 【问题描述】:我正在使用 Yii ajaxSubmitButton() 提交表单。此外,我已将 'enableAjaxValidation' 参数设置为 true 以验证相应的文本框。
我能做什么:
-
在焦点离开时异步验证字段。
单击按钮时异步调用服务器端方法。
问题是我不知道如何在单击提交按钮时执行字段验证,如果验证了模型,则在客户端执行部分渲染。
如果我在 ajaxSubmitButton 中覆盖 'success' 事件,我会得到部分渲染,但我无法维护模型验证..
有什么帮助吗?
编辑
感谢回复,
validateOnSubmit 标志已设置,如果未设置“成功”事件,模型将正确验证。
当ajaxSubmitButton是这样的:
<?php echo Chtml::ajaxSubmitButton( 'Send',
CHtml::normalizeUrl(array('site/ajaxIndexSubmit')),
array(
'error'=>'js:function()
alert(\'error\');
',
'beforeSend'=>'js:function()
alert(\'beforeSend\');
',
'success'=>'js:function(data)
alert(\'success, data from server: \'+data);
',
'complete'=>'js:function()
alert(\'complete\');
',
//'update'=>'#where_to_put_the_response',
)
);
?>
alert('success') 将打印与模型验证对应的字符串。一旦我有了那个字符串,客户端必须调用什么逻辑?
覆盖“成功”javascript 处理程序的原因是从服务器接收部分渲染,这与模型验证不同。我想要两件事:验证和部分渲染。
【问题讨论】:
好问题,我也没有找到将 validateOnSubmit 与 ajaxSubmitButton 一起使用的方法 【参考方案1】:试试这个:
/*
1) Register the snippet into the HEAD. Be sure that it is linked after jquery.yii.js is linked.
2) Configure your CActiveForm instance like this:
*/
$this->beginWidget('CActiveForm', array(
...
'enableClientValidation'=>true,
'clientOptions'=>array(
'validateOnSubmit'=>true,
'afterValidate'=>'js:$.yii.fix.ajaxSubmit.afterValidate'
)
...
);
/*
3) Configure your CHtml::ajaxSubmitButton instance like this:
*/
echo CHtml::ajaxSubmitButton('Whateverlabel', 'whateverurl', array(
...
'beforeSend'=>'js:$.yii.fix.ajaxSubmit.beforeSend("#YOUR_FORM_ID")'
...
);
查看更多http://www.codexamples.com/90/chtml-ajaxsubmitbutton/或http://www.codexamples.com/category/chtml-8/
【讨论】:
【参考方案2】:检查这个sn-p,它解决了客户端的问题http://www.yiiframework.com/wiki/466/a-simple-way-to-get-yii-client-side-form-validation-run-when-submitting-by-ajax/
【讨论】:
单独的链接被认为是一个糟糕的答案(请参阅faq),因为它本身没有意义,并且不能保证目标资源在未来仍然存在。 It would be preferable 在这里包含答案的基本部分,并提供链接以供参考。【参考方案3】:嘿,我遇到了同样的问题,即使在使用 aftervalidate、beforevalidate 等时也能正常工作。其次,我喜欢为此使用扩展程序,因为我的应用程序已经有很多。 所以我做了这个:
编辑:根据 Barth 的建议,我将这些代码放在这里。
第 1 步:@您的控制器操作
public function actionMyAction()
$model=new User;
$this->performAjaxValidation($model);
if(isset($_POST['User']))
$model->attributes=$_POST['User'];
$valid=$model->validate();
if($valid)
//do anything here
echo CJSON::encode(array(
'status'=>'success'
));
Yii::app()->end();
else
$error = CActiveForm::validate($model);
if($error!='[]')
echo $error;
Yii::app()->end();
第 2 步:@您的观点 您的表单可能如下所示
<?php
$form=$this->beginWidget('CActiveForm', array(
'id'=>'user-form',
'enableAjaxValidation'=>true,
'action'=>$this->createUrl('myController/MyAction'),
'enableClientValidation'=>true,
)); ?>
<div class="errorMessage" id="formResult"></div>
<div id="AjaxLoader" style="display: none"><img src="<?php echo Yii::app()->request->baseUrl; ?>/images/spinner.gif"></img></div>
<div class="row-user-single">
<?php echo $form->labelEx($model,'attribute1'); ?>
<?php echo $form->passwordField($model,'attribute1',array('size'=>60,'maxlength'=>500)); ?>
<?php echo $form->error($model,'attribute1'); ?>
</div>
<div class="row-user-single">
<?php echo $form->labelEx($model,'attribute2'); ?>
<?php echo $form->passwordField($model,'attribute2',array('size'=>60,'maxlength'=>500)); ?>
<?php echo $form->error($model,'attribute2'); ?>
</div>
<div class="buttons">
<?php echo CHtml::ajaxSubmitButton('Save',CHtml::normalizeUrl(array('myController/MyAction','render'=>true)),
array(
'dataType'=>'json',
'type'=>'post',
'success'=>'function(data)
$("#AjaxLoader").hide();
if(data.status=="success")
$("#formResult").html("form submitted successfully.");
$("#user-form")[0].reset();
else
$.each(data, function(key, val)
$("#user-form #"+key+"_em_").text(val);
$("#user-form #"+key+"_em_").show();
);
',
'beforeSend'=>'function()
$("#AjaxLoader").show();
'
),array('id'=>'mybtn','class'=>'class1 class2')); ?>
这对我来说很好用 上面写的所有代码都是我的写作风格。您可以根据需要更改它们,但是, 只有两点需要注意: 1. @您的控制器调用验证您的模型并在表单无效时返回一个 json 对象 2. @你的视图打破这个json对象(或遍历它)并在表单的各个元素下显示错误消息。
保持简单:)
您也可以在这里看到我的博文: http://www.yiiframework.com/forum/index.php/topic/37075-form-validation-with-ajaxsubmitbutton/
【讨论】:
欢迎来到 ***!您想在答案中添加链接的摘录吗?这样,如果链接失效,您的答案仍然有用。【参考方案4】:我找到了解决方案。 我的 CActive 表单
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'gold-value-form',
'enableAjaxValidation'=>true,
'clientOptions'=>array(
'validateOnSubmit'=>true,
'afterValidate'=>'js:function(form, data, hasError)
if(jQuery.isEmptyObject(data))
alert("ok")
return false;
'
),
)); ?>
我的创建动作
public function actionCreate()
$this->layout=false;
$model=new GoldValue;
if(isset($_POST['ajax']) && $_POST['ajax']==='gold-value-form')
if(isset($_POST['GoldValue']))
$model->attributes=$_POST['GoldValue'];
if(!$model->save())
echo CActiveForm::validate($model);
Yii::app()->end();
【讨论】:
【参考方案5】:我将尝试在单击 ajaxSubmitButton 时发送不同的值(使用 $_GET 发布)。测试该值,然后在该值不存在时运行验证。这对你有用吗?
【讨论】:
【参考方案6】:CActiveForm
有一个名为$clientOptions
的公共属性。有一个 validateOnSubmit
选项默认为 false。你需要它是真实的。在您看来,它应该如下所示:
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'yourFormId',
'enableAjaxValidation'=>TRUE,
'clientOptions'=>array('validateOnSubmit'=>TRUE),
)); ?>
http://www.yiiframework.com/doc/api/1.1/CActiveForm#clientOptions-detail
【讨论】:
此验证未使用 ajaxSubmitButton 执行。它仅适用于 CHtml::submitButton以上是关于带有字段验证的 Yii ajaxSubmitButton()的主要内容,如果未能解决你的问题,请参考以下文章