CODEWITHSUNDEEP
ajaxformsvalidationyiihighlight
kussberg
kussberg

Reputation: 559

Yii Bootstrap Form AJAX Validation and Highlighting

i would like to share my snippets for validating a yii bootstrap ajax form and highlight the error and valid fields. The form should have disabled the validations.

Upvotes: 1

Views: 4899

Answers (2)

jack
jack

Reputation: 843

add this parameter to your TbActiveForm

'enableAjaxValidation'=>true,

Upvotes: 0

kussberg
kussberg

Reputation: 559

i would like to share my snippets for validating a yii bootstrap ajax form and highlight the error and valid fields. The form should have disabled the validations.

Form:

    $form = $this -> beginWidget('bootstrap.widgets.TbActiveForm', array(
        'id' => 'user-time-form',
        'type' => 'horizontal',
));

Submit button:

$this -> widget('bootstrap.widgets.TbButton', array(
            'buttonType' => 'ajaxSubmit',
            'icon' => 'ok',
            'url' => Yii::app() -> createUrl('hr/userTime/create'),
            'label' => 'Submit',
            'ajaxOptions' => array('success' => 'function(data){
                    var obj = $.parseJSON(data);
                    if(obj.status=="success"){
                        $("#newUserTime").modal("hide");
                        setTimeout(function(){location.reload(true);},400);
                    } else {
                        $("#userTime-form-error-div").show();
                        $("#userTime-form-error-div").html("");
                        var $inputs = $("#user-time-form :input");
                        $inputs.each(function() {
                            $(this).removeClass("error");
                            $(this).closest(\'div[class^="control-group"]\').addClass("success validating");
                        });
                        for (var p in obj) {
                            if(document.getElementById(p)) {
                                $("#"+p).closest(\'div[class^="control-group"]\').removeClass("success");
                                $("#"+p).closest(\'div[class^="control-group"]\').addClass("error");
                            }
                            $("#userTime-form-error-div").append(obj[p]  + "<br/>");
                        }
                    }
                }'),
    ));

Upvotes: 3

Related Questions