Bootstrap 如果选中复选框,如何禁用或启用引导数据库提交按钮

mlmc2os5  于 2022-12-16  发布在  Bootstrap
关注(0)|答案(3)|浏览(167)

我需要启用或禁用表单上的 Bootstrap 提交按钮(无论是否选中复选框)

echo "<div class='panel panel-danger'><div class='panel-heading'>OBSERVACIONES</div><div class='panel-body'>";
echo "<div class='input-group'>";
echo "<label class='checkbox-inline'><input type='checkbox' name='visto' id='visto' value=''> Visto bueno del Responsable</label>";
echo "</div>"; 
echo "</div>"; 

...

echo "<input type='submit' class='btn btn-primary' value='SAVE' name='grabaperaus' formaction='update.php'>";
8zzbczxx

8zzbczxx1#

对于复选框,您需要做的就是获取提交buttonId(本例中为grabaperaus),禁用checkboxonChange事件。

<input type="checkbox"  
onchange="document.getElementById('grabaperaus').disabled = !this.checked;" name='visto' 
id='visto'/>
a7qyws3x

a7qyws3x2#

使用Jquery
超文本:

<input type='checkbox' data-toggle='inputid'/>
<input id='inputid'/>

脚本:

function toggle(target) {
    var toggle = $(target).data("toggle");
    if (toggle) {
        var obj = $("#" + toggle);
        if (target.checked ==false) {
            obj.attr("disabled", "disabled");
        } else {
            obj.removeAttr("disabled");
        }
    }
}

$("input:checkbox").each(function(){toggle(this);}).on('input',function(){toggle(this);});
qnzebej0

qnzebej03#

试试这个

$(document).ready(function(){
    $('#save').prop('disabled', true);

    $('#visto').click(function(){
        if($(this).is(':checked'))
        {
            $('#save').prop('disabled', false);
        }
        else
        {
            $('#save').prop('disabled', true);
        }
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class='checkbox-inline'><input type='checkbox' name='visto' 
id='visto' value=''> Visto bueno del Responsable</label>

<input type='submit' class='btn btn-primary' id="save" value='SAVE' name='grabaperaus' formaction='update.php'>

相关问题