成功或错误消息输入javascript bootstrap

时间:2014-02-27 12:17:59

标签: javascript jquery html css twitter-bootstrap

有没有办法更改我的输入,以便在输入中显示成功或错误图标?喜欢:http://getbootstrap.com/css/#forms-control-validation 很感激。
这是我的代码:

<script>
    $(document).ready(function () {
        $('input[name=subdomain]').keyup(subdomain_check);
    });

    function subdomain_check() {
        var subdomain = $('input[name=subdomain]').val();
        if (subdomain == "") {
            $('input[name=subdomain]');
        } else {
            jQuery.ajax({
                type: "POST",
                url: "ajax.php",
                data: 'subdomain=' + subdomain,
                cache: false,
                success: function (response) {
                    if (response == 1) {
                        $('input[name=subdomain]').html("The URL already exist!");
                    } else {
                        $('input[name=subdomain]').html("The URL is Valid!");
                    }
                }
            });
        }
    }
</script>

HTML代码:

    <div class="form-group">
        <label class="control-label col-md-3" for="install-element-6">
            <span class="required">* </span>subdomain</label>
    <div class="col-md-6"> //<----- I want it here
        <input type="text" class="form-control input-md col-md-6" name="subdomain" placeholder required id="install-element-6"/> // the method.addClass add it here
    </div>
    </div>

非常感谢。

1 个答案:

答案 0 :(得分:1)

现在可以通过添加方法parent()来获取元素div而不是input

if(response == 1){
            $('input[name=subdomain]').parent().removeClass("has-success");
            $('input[name=subdomain]').parent().addClass("has-error");
        }else{
            $('input[name=subdomain]').parent().removeClass("has-error");
            $('input[name=subdomain]').parent().addClass("has-success");

             }