Deaktivieren von Textfeld durch Javascript

Question

Ich habe eine Eingabe HTML-Seite, die Textfeld und ein Kontrollkästchen zum Deaktivieren dieses Eingabefeldes haben.

Dies ist der JavaScript-Code zum Deaktivieren des Textfelds in einer .js Datei. value übergibt den Feldnamen für das Kontrollkästchen.

In der HTML-Seite ist dies der HTML-Code und der JS-Code.

<tr> 
       <td >data</td> 
        <td colspan="3"> 
         <input type="text" id="data_value" name="data_vale" size="50"value='<?php echo $data?>'> 
       </td> 
       <td colspan = "3"> 
       <?php 
        if($check_data != ''){?> 
         <input type="checkbox" checked name="undefined_data" id="undefined_data" onclick="disable_input_field('data')" >disable 
       <?php }else{?> 
         <input type="checkbox" name="undefined_data" id="undefined_data" onclick="disable_input_field('data')" >disable 
       <?php }?> 
       <input type="hidden" name="data" id="data"> 
       </td> 
      </tr> 
      <tr> 

........................................... .....................................

$(document).ready(function() { 
    if(document.getElementById('check_data').value == 'data'){ 
     disable_input_field('data'); 
    } 
}  

In der Steuerung

if ($this->input->post('data') == 'disabled') { 
    $data['check_data'] = 'data'; 
} 

Aber Deaktivieren des Textfelds funktioniert nicht. Bitte helfen Sie mir dabei.

Answer 1

Es sieht so aus, als ob Sie das Kontrollkästchen anstelle des Textfelds deaktivieren. Ändern Sie den Code aus:

function disable_input_field(value){  
    if ($("#undefined_" + value).is(":checked")) {  
     document.getElementById("undefined_" + value).disabled = true;  
     document.getElementById(value).value = '??';  
    }else{  
     $("#" + value).prop("disabled", false);   
     document.getElementById(value).value = '';  
    } 

zu:

function disable_input_field(value){  
    if ($("#undefined_" + value).is(":checked")) {  
     document.getElementById("#" + value + "_value").disabled = true;  
     document.getElementById(value).value = '??';  
    }else{  
     $("#" + value + "_value").prop("disabled", false);   
     document.getElementById(value).value = '';  
    } 

Answer 2

Sie deaktiviert Attribut für das Element gesetzt werden, zum Beispiel

document.getElementById('data_value').setAttribute('disabled ', 'disabled'); 

Answer 3

Sie verwendet haben, die ID "CHECK_DATA" in Unterhalb der Zeile sehe ich das "check_data" -Element im HTML-Code nicht. Dies könnte die Ursache sein, anderer Code scheint in Ordnung zu sein.

if(document.getElementById('check_data').value == 'data'){ 

Answer 4

Sie verweisen auf check_data in Ihrem jquery

$(document).ready(function() { 
    if(document.getElementById('check_data').value == 'data'){ 
     disable_input_field('data'); 
    } 
} 

Aber Sie haben nicht das Element noch gemacht.

Auch verwende ich diese Kontrollen zu deaktivieren, so Gedanken könnte :)

$(document).ready(function(){ 
 

 
$(document).on('change', '#check1', function(e){ 
 
    if($(this).is(':checked')){ 
 
     $('#input1').addClass('disabled-control'); 
 
    } 
 
    else 
 
    { 
 
     $('#input1').removeClass('disabled-control'); 
 
    } 
 
}); 
 

 

 
});

.disabled-control{ 
 
     opacity: 0.4; 
 
     cursor: not-allowed; 
 
     pointer-events: none; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> 
 
<input type="text" id="input1"> 
 
<input type="checkbox" id="check1">Disable