简体   繁体   English

选中复选框后,我需要启用表单(在页面加载时被禁用)

[英]I need to enable form (it is disabled on page load) after checkbox checked

I need your help here cause I am not aware of javascript or jquery library and i think i definitely have to use them in my project.I have a disabled form when the page loads and I want to enable when I checked on the check box.I tried a lot but I didn't find any solutions.. 我在这里需要您的帮助,因为我不了解javascript或jquery库,我认为我绝对必须在我的project中使用它们。页面加载时我有一个禁用的表单,我想在选中复选框时启用。我尝试了很多,但是没有找到任何解决方案。

Here is the 'disable' code when the page loads: 页面加载时,以下是“禁用”代码:

$(document).ready(function (e) {
  $("#form1 *").prop("disabled", "disabled");
});

The checkbox is : 复选框是:

<input type="checkbox" id="checkbox" name="opt[]" value="'.$points.'">

If you have any ideas please inform me! 如果您有任何想法请通知我!

One shot but ..no result was: 一枪但..没有结果是:

document.getElementById('checkbox').onchange = function() {
  document.getElementById('eksargirwsh').disabled = this.checked;
};

form code: 表格代码:

 <form method="post" id="eksargirwsh" action="update_points_test2.php">

           <div class="col-lg-4">
               <div class="ibox float-e-margins">
                    <div class="ibox-title">
                                    <h5>Form1</h5>

                                </div>
                                <div class="ibox-content">

echo '

                                    <div>
                                        <div class="feed-activity-list"><div style="border: 0.5px solid green; border-right-style:none;" class="input-group m-b"><span class="input-group-addon"> 
                                                <input type="checkbox" id="checkbox" name="opt[]" value="'.$points.'"></span>
                                                <input type="hidden" name="opt2[]" value="'.$row_select4['id'].'">


                                          <div class="feed-element">
                                                <a href="profile.html" class="pull-left">
                                            <img alt="image" class="img-circle" src="'. $row_select4['image_url']. '">
                                                </a>
                                          <div class="media-body ">
                                         <div class="ibox-tools">
                                                        <span class="label label-primary">ΔΙΑΘΕΣΙΜΟ</span><br><br>
                                                        <span class="label label-warning-light pull-right"><strong>'  .$row_select4['points'].  '</strong> Πόντοι</span>
                                                    </div>
                                                    <strong>'  .$row_select4['title'].  ' </strong> '   .$row_select4['description'].  ' <br>
                                                    <small class="text-muted">Διάρκεια: <strong>'  .$row_select4['start_date'].  ' - '   .$row_select4['end_date'].  ' </strong></small>
                                                    <div class="well">
                                                        '  .$row_select4['description'].  '
                                                    </div>
                                                  </div>
                                                </div>
                                            </div>

                                       </div>'  ;

 <button type="submit" id="submit" class="btn btn-w-m btn-primary">SUBMIT</button> 
                          </form>

Use this. 用这个。 You can select elements which are not #checkbox , then disable them at first. 您可以选择不是#checkbox元素,然后首先将其禁用。 Then, add a function to checkbox change, to enable if checked. 然后,将功能添加到checkbox更改,如果选中则启用。

$(document).ready(function (e) {
  $("#form1 *:not(#checkbox)").prop("disabled", true);
  $("#form1").addClass('disabled');
  $('#checkbox').change(function(){
    $("#form1 *:not(#checkbox)").prop("disabled", !this.checked);
    $("#form1").toggleClass('disabled', !this.checked);
  })
});
#form1{
    opacity: 1;
}
#form1.disabled{
    opacity: 0.2;
}

The checkbox is in the same form if it is then 如果是,则复选框的格式相同

you have to do whole page disable except that 您必须禁用整个页面,除了

$(document).ready(function() {
       $('form :not([type=checkbox])').prop('disabled',true);

});

put this function in checkbox 将此功能放在复选框中

 $(":checkbox").click(function(){
    if (this.checked) {
       $('#form :not([type=checkbox])').prop('disabled',false);
    }
    else{
     $('#form :not([type=checkbox])').prop('disabled',true);
    }
}) ;

For the User requirement Fiddle is created below is the link 对于用户要求,在下面创建了小提琴,是链接

JSFiddle 的jsfiddle

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 我只需要禁用提交表单后选中的复选框: - I need to disable ONLY the checkbox that is checked after i submit the form: 在页面加载后将复选框设置为使用JavaScript进行检查 - Set Checkbox to Checked with JavaScript after page Load 我需要一种表单,如果选中了表单中的复选框,然后将“提交”按钮打印页面,该表单会将一个类应用于div - I need a form that will apply a class to a div if a checkbox in form is checked then have submit button print the page 选中复选框后,如何启用单选按钮? - How do I enable the radio buttons after the checkbox is checked? 比较表单提交时复选框的选中状态与页面加载状态 - Comparing checkbox checked state versus page load state on form submit 如何检查页面加载时是否选中了复选框,如果选中,则显示表单? - how to check if a checkbox is checked on page load, and if it does,then show a form? Angular 响应式表单:无法在页面加载时绑定复选框选中的属性 - Angular Reactive form: Unable to bind checkbox checked property on page load jQuery:CheckBox是否在页面加载时被选中? - jQuery: Is CheckBox checked on page load? 检查页面加载时检查框不起作用 - Checkbox checked on page load not working 如果选中了复选框2,则复选框1被禁用 - Checkbox 1 is disabled if Checkbox 2 is checked
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM