yiibooster向导验证

时间:2014-02-10 13:00:06

标签: javascript jquery yii widget yii-booster

我已经完成了yiibooster向导表单,一切都运行正常但我想强迫客户点击TbExtendedGridView,然后再进行下一步。

在表单中有2个TbExtendedGridView和2个日期字段。

以下是表格的一些代码:

    <?php $form=$this->beginWidget('bootstrap.widgets.TbActiveForm', array(
    'id'=>'zf-contratos-form',
    // Please note: When you enable ajax validation, make sure the corresponding
    // controller action is handling ajax validation correctly.
    // There is a call to performAjaxValidation() commented in generated controller code.
    // See class documentation of CActiveForm for details on this.
    'enableAjaxValidation'=>false,
    'htmlOptions'=>array('class'=>'well'),
    'action' => array( '/ZfContratos/create' ),
)); ?>
    <div id="wizard-bar" class="progress progress-striped active">
    <div class="bar"></div>
    </div>
    <?php $this->widget(
    'bootstrap.widgets.TbWizard',
    array(
        'type' => 'tabs', // 'tabs' or 'pills'
        'pagerContent' => '<div style="float:right">
                    <input type="button" class="btn button-next" name="next" value="Siguiente" />
                </div>
                <div style="float:left">
                    <input type="button" class="btn button-previous" name="previous" value="Atrás" />
                </div>
                <br /><br />',
        'options' => array(
            'nextSelector' => '.button-next',
            'previousSelector' => '.button-previous',
            'onTabShow' => 'js:function(tab, navigation, index) {
                        var $total = navigation.find("li").length;
                        var $current = index+1;
                        var $percent = ($current/$total) * 100;
                        $("#wizard-bar > .bar").css({width:$percent+"%"});
            }',
            'onTabClick' => 'js:function(tab, navigation, index) {alert("Tab Click Disabled");return false;}',
        ),
        'tabs' => array(
            array(
                'label' => 'Arrendatarios',
                'content' => $this->renderPartial('//ZfContratos/_form_arrendatarios', array('model' => $model, 'form' => $form), true),
                'active' => true
            ),
            array('label' => 'Inmuebles', 'content' => $this->renderPartial('//ZfContratos/_form_inmuebles', array('model' => $model, 'form' => $form), true)),
            array('label' => 'Fecha', 'content' => $this->renderPartial('//ZfContratos/_form_contratos', array('model' => $model, 'form' => $form), true)),
        ),
    )
); ?>

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

程序将是第一步,“下一步”禁用,当客户clik在TbExtendedGridView“next”的一行上时,他可以点击“下一步”进入下一步。

非常感谢你。

CODE TESTED WORKING:

$cs = Yii::app()->getClientScript();
$cs->registerScript('hello', "
    $(window).load(function()
    { 
        alert('hello');
        $('#next').attr('disabled',true);
    });");
$cs->registerScript('button',"
        $('#arrendatario').click(function() 
        {
            $('#next').attr('disabled',false);
    });");

1 个答案:

答案 0 :(得分:0)

您可以在Jquery中执行此操作。首先,您必须设置TbExtendedGridView的ID。下一个按钮包含课程next然后你喜欢这个

<script type="text/javascript">
window.onload=function(){
$('.next').attr('disabled',true);
}
$(document).ready(
function()
{
   $('.grid-view').click(function() 
{
   $('.next').attr('disabled',false);
});
}
);
</script>

我使用了class作为选择器,但你可以使用use ID作为选择器作为“#selector”。您还可以在grid-view的子元素上使用jquery。以上只是一个例子 这里有一些关于jquery选择器的信息 http://www.w3schools.com/jquery/jquery_ref_selectors.asp

修改 尝试

   <?php $cs = Yii::app()->getClientScript();
$cs->registerScript('hello', "
$(window).load(function()
{ 
    alert('hello');
}
)");
?>

如果这样可行,则复制此脚本中的整个代码。