twitter-bootstrap水平表单验证

时间:2012-11-13 14:02:58

标签: jquery jquery-ui twitter-bootstrap

这是来自

的横向示例

                 

    <input data-val="true" data-val-required="The password and confirmation password:" id="InstanceID" name="MainSearchModel.InstanceID" placeholder="Enter instanceID..." type="text" value="" />


    <input id="MainSearchModel_ServiceName" name="MainSearchModel.ServiceName" placeholder="Enter serviceName..." type="text" value="" />

我正在尝试验证表单,但是当我使用bootstrap class =&#34; control-group&#34; jQuery-Live-Form-Validation-For-Twitter-Bootstrap 它会为错误说明创建空白区域,您可以在此处看到from after adding class

验证水平表单的最佳方法是什么?

如何让邮件显示在文本框的底部而不是显示在 文本框的右侧?

感谢

1 个答案:

答案 0 :(得分:1)

使用此按钮检查验证并禁用表单的AJAX和CLIENT验证:

$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/>");
                        }
                    }
                }'),
    ));

希望这有助于某人获得有效和错误字段的精彩亮点!