Ich muss Formular aktivieren (es ist beim Laden der Seite deaktiviert) nach Kontrollkästchen aktiviert

Question

Ich brauche deine Hilfe hier, weil ich nicht bewusst von Javascript oder Jquery-Bibliothek, und ich denke, ich muss sie in meinem Projekt verwenden deaktiviert Formular, wenn die Seite lädt und ich möchte aktivieren, wenn ich auf das Kontrollkästchen aktiviert.Ich habe eine Menge versucht, aber ich habe keine Lösungen gefunden ..

Hier ist der "deaktivieren" -Code beim Laden der Seite:

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

Die Checkbox ist:

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

Wenn Sie irgendwelche Ideen haben, bitte informieren Sie mich!

Ein Schuss aber ..no Ergebnis war:

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> 

Answer 1

Das Kontrollkästchen ist in der gleichen Form, wenn es dann ist

Sie ganze Seite zu tun haben, zu deaktivieren, außer dass

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

}); 

diese Funktion in Checkbox setzen

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

Für die Benutzeranforderung Fiddle unten erstellt wird, ist der Link

JSFiddle

Answer 2

verwenden. Sie können Elemente auswählen, die nicht #checkbox sind, und sie dann zuerst deaktivieren. Fügen Sie anschließend eine Funktion zu checkbox change hinzu, um diese Option zu aktivieren.

$(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; 
}