Включить / отключить txtBox в соответствии со значением comboBox - PullRequest
Новая
       13

Включить / отключить txtBox в соответствии со значением comboBox

0 голосов
/ 05 декабря 2018

Я задаю вам следующий вопрос, я должен убедиться, что в зависимости от выбора значения comboBox некоторые textBox / некоторые кнопки отключены .. глядя на форуме, я нашел это решение, но оно не работает ...

Включить текстовое поле формы HTML на основе значения раскрывающегося меню в той же форме?

Я прилагаю свой код ... 

function changeTextBox() {
    comp = document.getElementById('tipologiaMezzoSubAffidataria');
    if(comp.value=='1 - Mezzi d opera')
        document.getElementById('documentiRadioComando').disabled=true;
		document.getElementById('realizzazioneBasamento').disabled=true;
		document.getElementById('rischioFulminazione').disabled=true;
		document.getElementById('denunciaMessaInServizioInail').disabled=true;
		document.getElementById('verificaPeriodicaInail').disabled=true;
		document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
		document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
		document.getElementById('verificaTrimestraleFuni').disabled=true;
		document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
    else;
	if(comp.value=='2 - Automezzi')
		document.getElementById('certificatoConformitàCE').disabled=true;
        document.getElementById('registroPeriodicheInterne').disabled=true;
		document.getElementById('documentiRadioComando').disabled=true;
		document.getElementById('realizzazioneBasamento').disabled=true;
		document.getElementById('correttaEsecuzioneBasamento').disabled=true;
		document.getElementById('rischioFulminazione').disabled=true;
		document.getElementById('denunciaMessaInServizioInail').disabled=true;
		document.getElementById('verificaPeriodicaInail').disabled=true;
		document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
		document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
		document.getElementById('verificaTrimestraleFuni').disabled=true;
		document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
    else;
	
	 if(comp.value=='4 - Attrezzature')
        document.getElementById('annoCostruzioneMezzoSubAffidataria').disabled=true;
	    document.getElementById('certificatoConformitàCE').disabled=true;
		document.getElementById('librettoDiUsoEManutenzione').disabled=true;
		document.getElementById('librettoDiCircolazione').disabled=true;
        document.getElementById('registroPeriodicheInterne').disabled=true;
		document.getElementById('documentiRadioComando').disabled=true;
		document.getElementById('realizzazioneBasamento').disabled=true;
		document.getElementById('correttaEsecuzioneBasamento').disabled=true;
		document.getElementById('rischioFulminazione').disabled=true;
		document.getElementById('denunciaMessaInServizioInail').disabled=true;
		document.getElementById('verificaPeriodicaInail').disabled=true;
		document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
		document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
		document.getElementById('verificaTrimestraleFuni').disabled=true;
		document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
    else;
}
<table cellspacing="0" cellpadding="0"  id="table4" name="table4"  class=" table order-list"> <tr>
       <form method="POST" action='azioniContinua/inserisciMezzoSubAffidatario.php'>

		<td  style="vertical-align: middle;" align="center" class="coloreTdAttiva">SI/NO</br><input  type="checkbox" class="chkView"/></td>
	    <td bgcolor="#DCDCDC"><input type="text" name="idMezzoAttrezzaturaSubAffidataria" id="idMezzoAttrezzaturaSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	  <td width="144" bgcolor="#6DFD1E">AUTORIZZATO    /<br>NON AUTORIZZATO / <br> DOCUMENTI IN SCADENZA</td>
	    <td>
 		<select name="tipologiaMezzoSubAffidataria" id="tipologiaMezzoSubAffidataria" class="form-control chkEdit larghezzaBase" enable onChange="changeTextBox();">
  			
			<option value="1 - Mezzi d opera">1 - Mezzi d opera</option>
			<option value="2 - Automezzi">2 - Automezzi</option>
			<option value="3 - Mezzi di sollevamento (All. VII del D-Lgs. 81/08)">3 - Mezzi di sollevamento (All. VII del D-Lgs. 81/08)</option>
			<option value="4 - Attrezzature">4 - Attrezzature</option>
			
			   
  			
			
 </select>
 </td>
	    <td><input type="text" name="sottoTipologiaMezzoSubAffidataria" id="sottoTipologiaMezzoSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	    <td><input type="text" name="marcaMezzoSubAffidataria" id="marcaMezzoSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
		<td><input type="text" name="modelloMezzoSubAffidataria" id="modelloMezzoSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	    <td><input type="text" name="matricolaMezzoSubAffidataria" id="matricolaMezzoSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	    <td><input type="date" name="annoCostruzioneMezzoSubAffidataria" id="annoCostruzioneMezzoSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	    <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="certificatoConformitàCE" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td><td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="librettoDiUsoEManutenzione" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	   <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="librettoDiCircolazione" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	    <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="registroPeriodicheInterne" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	   <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="documentiRadioComando" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	   <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="realizzazioneBasamento" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	    <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File"  id="correttaEsecuzioneBasamento" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	    <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="rischioFulminazione" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	   <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File"  id="denunciaMessaInServizioInail" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	    <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="verificaPeriodicaInail" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	    <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="ultimaVerificaPeriodicaASL"  class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	   <td><b>Scadenza:<b><br/><input type="date" name="scadenzaUltimaVerificaMezzoSubAffidataria" id="scadenzaUltimaVerificaMezzoSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	   <td  class="coloreTdDrop" align="center">
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File" id="verificaTrimestraleFuni" class="btn btn-success" onclick="file_explorer();">
		</div>
	</td>
	    <td><b>Scadenza:<b><br/><input type="date" name="scadenzaUltimaVerificaFuniMezzoSubAffidataria" id="scadenzaUltimaVerificaFuniMezzoSubAffidataria" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	  <td><b>Note:<b><br/><input type="text" name="note" id="note" width="75px" class="form-control chkEdit larghezzaBase" enable></td>
	    	    <td style=" border-style: none;"> <input type="text" name="fkIdAffidataria" id="fkIdAffidataria" width="75px" class="form-control chkEdit larghezzaBase" value="<?php echo $fkIdAffidataria?>"></td>

                <td><input type="submit" name="submit" onclick="location.href='subAffidatario.php'" value="Salva MezzoDiTrasporto" class="btn btn-primary"/></td>
	    <td width="144" bgcolor="#6DFD1E">AUTORIZZATO    /<br>
	      NON AUTORIZZATO</td>
	    <td><input type="submit" name="submit" onclick="location.href='subAffidatario.php'" value="Scarica BADGE" class="btn btn-primary"/></td>
	     <td>
 		<select name="dataDiAutorizzazione" id="dataDiAutorizzazione" class="form-control chkEdit larghezzaBase" enable>
  			
			<option value="Mezzi d'opera"></option>
			
			
		 </select>
		</td>
</form>
      </tr>
      </table>

Я хочу, чтобы при изменении значения comboBox текстовые поля, которые я вставлял в скрипт, были отключены.Например, группа («1 - Опера Мецци») должна деактивировать следующие поля: 

 document.getElementById('documentiRadioComando').disabled=true;
    document.getElementById('realizzazioneBasamento').disabled=true;
    document.getElementById('rischioFulminazione').disabled=true;
    document.getElementById('denunciaMessaInServizioInail').disabled=true;
    document.getElementById('verificaPeriodicaInail').disabled=true;
    document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
    document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
    document.getElementById('verificaTrimestraleFuni').disabled=true;
    document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;

, но все остальное должно быть активным

Ответы [ 3 ]

0 голосов
/ 05 декабря 2018

Прежде всего ваш HTML очень грязный, например, отсутствует закрывающий тег или даже используется вместо негодля перерыва.Многие атрибуты элемента «table» устарели ...

Вы можете использовать этот инструмент для обнаружения синтаксических ошибок: https://www.freeformatter.com/html-validator.html

После этого вам придется изменить свойструктура JavaScript, как сказано выше. 

function changeTextBox() {
comp = document.getElementById('tipologiaMezzoSubAffidataria');

if(comp.value=='1 - Mezzi d opera') {
  document.getElementById('documentiRadioComando').disabled=true;
  document.getElementById('realizzazioneBasamento').disabled=true;
  document.getElementById('rischioFulminazione').disabled=true;
  document.getElementById('denunciaMessaInServizioInail').disabled=true;
  document.getElementById('verificaPeriodicaInail').disabled=true;
  document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
  document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
  document.getElementById('verificaTrimestraleFuni').disabled=true;
  document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
} else if(comp.value=='2 - Automezzi') {
  document.getElementById('certificatoConformitàCE').disabled=true;
  document.getElementById('registroPeriodicheInterne').disabled=true;
  document.getElementById('documentiRadioComando').disabled=true;
  document.getElementById('realizzazioneBasamento').disabled=true;
  document.getElementById('correttaEsecuzioneBasamento').disabled=true;
  document.getElementById('rischioFulminazione').disabled=true;
  document.getElementById('denunciaMessaInServizioInail').disabled=true;
  document.getElementById('verificaPeriodicaInail').disabled=true;
  document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
  document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
  document.getElementById('verificaTrimestraleFuni').disabled=true;
  document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
} else if (comp.value=='4 - Attrezzature'){
  document.getElementById('annoCostruzioneMezzoSubAffidataria').disabled=true;
  document.getElementById('certificatoConformitàCE').disabled=true;
  document.getElementById('librettoDiUsoEManutenzione').disabled=true;
  document.getElementById('librettoDiCircolazione').disabled=true;
  document.getElementById('registroPeriodicheInterne').disabled=true;
  document.getElementById('documentiRadioComando').disabled=true;
  document.getElementById('realizzazioneBasamento').disabled=true;
  document.getElementById('correttaEsecuzioneBasamento').disabled=true;
  document.getElementById('rischioFulminazione').disabled=true;
  document.getElementById('denunciaMessaInServizioInail').disabled=true;
  document.getElementById('verificaPeriodicaInail').disabled=true;
  document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
  document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
  document.getElementById('verificaTrimestraleFuni').disabled=true;
  document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
}}
0 голосов
/ 05 декабря 2018

в дополнение к проблеме, связанной с остальным, у вас также есть проблема, что каждый раз, когда вы меняете, вы должны активировать и деактивировать все свои поля .. в противном случае они сохраняют статус предыдущего выбора 

if(comp.value=='1 - Mezzi d opera') {
  document.getElementById('sottoTipologiaMezzoSubAffidataria').disabled=false;
  document.getElementById('marcaMezzoSubAffidataria').disabled=false;
  document.getElementById('modelloMezzoSubAffidataria').disabled=false;
  document.getElementById('matricolaMezzoSubAffidataria').disabled=false;
  document.getElementById('annoCostruzioneMezzoSubAffidataria').disabled=false;
  document.getElementById('certificatoConformitàCE').disabled=false;
  document.getElementById('librettoDiUsoEManutenzione').disabled=false;
  document.getElementById('librettoDiCircolazione').disabled=false;
  document.getElementById('registroPeriodicheInterne').disabled=false;
  document.getElementById('documentiRadioComando').disabled=true;
  document.getElementById('realizzazioneBasamento').disabled=true;
  document.getElementById('correttaEsecuzioneBasamento').disabled=true;
  document.getElementById('rischioFulminazione').disabled=true;
  document.getElementById('denunciaMessaInServizioInail').disabled=true;
  document.getElementById('verificaPeriodicaInail').disabled=true;
  document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
  document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
  document.getElementById('verificaTrimestraleFuni').disabled=true;
  document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
} else if(comp.value=='2 - Automezzi') {
   document.getElementById('sottoTipologiaMezzoSubAffidataria').disabled=false;
  document.getElementById('marcaMezzoSubAffidataria').disabled=false;
  document.getElementById('modelloMezzoSubAffidataria').disabled=false;
  document.getElementById('matricolaMezzoSubAffidataria').disabled=false;
  document.getElementById('annoCostruzioneMezzoSubAffidataria').disabled=false;
  document.getElementById('certificatoConformitàCE').disabled=true;
  document.getElementById('librettoDiUsoEManutenzione').disabled=false;
  document.getElementById('librettoDiCircolazione').disabled=false;
  document.getElementById('registroPeriodicheInterne').disabled=true;
  document.getElementById('documentiRadioComando').disabled=true;
  document.getElementById('realizzazioneBasamento').disabled=true;
  document.getElementById('correttaEsecuzioneBasamento').disabled=true;
  document.getElementById('rischioFulminazione').disabled=true;
  document.getElementById('denunciaMessaInServizioInail').disabled=true;
  document.getElementById('verificaPeriodicaInail').disabled=true;
  document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
  document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
  document.getElementById('verificaTrimestraleFuni').disabled=true;
  document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
} else if(comp.value=='3 - Mezzi di sollevamento (All. VII del D-Lgs. 81/08)') {
  document.getElementById('sottoTipologiaMezzoSubAffidataria').disabled=false;
  document.getElementById('marcaMezzoSubAffidataria').disabled=false;
  document.getElementById('modelloMezzoSubAffidataria').disabled=false;
  document.getElementById('matricolaMezzoSubAffidataria').disabled=false;
  document.getElementById('annoCostruzioneMezzoSubAffidataria').disabled=false;
  document.getElementById('certificatoConformitàCE').disabled=false;
  document.getElementById('librettoDiUsoEManutenzione').disabled=false;
  document.getElementById('librettoDiCircolazione').disabled=false;
  document.getElementById('registroPeriodicheInterne').disabled=false;
  document.getElementById('documentiRadioComando').disabled=false;
  document.getElementById('realizzazioneBasamento').disabled=false;
  document.getElementById('correttaEsecuzioneBasamento').disabled=false;
  document.getElementById('rischioFulminazione').disabled=false;
  document.getElementById('denunciaMessaInServizioInail').disabled=false;
  document.getElementById('verificaPeriodicaInail').disabled=false;
  document.getElementById('ultimaVerificaPeriodicaASL').disabled=false;
  document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=false;
  document.getElementById('verificaTrimestraleFuni').disabled=false;
  document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=false;
} else if (comp.value=='4 - Attrezzature'){
  document.getElementById('sottoTipologiaMezzoSubAffidataria').disabled=false;
  document.getElementById('marcaMezzoSubAffidataria').disabled=false;
  document.getElementById('modelloMezzoSubAffidataria').disabled=false;
  document.getElementById('matricolaMezzoSubAffidataria').disabled=false;
  document.getElementById('annoCostruzioneMezzoSubAffidataria').disabled=true;
  document.getElementById('certificatoConformitàCE').disabled=true;
  document.getElementById('librettoDiUsoEManutenzione').disabled=true;
  document.getElementById('librettoDiCircolazione').disabled=true;
  document.getElementById('registroPeriodicheInterne').disabled=true;
  document.getElementById('documentiRadioComando').disabled=true;
  document.getElementById('realizzazioneBasamento').disabled=true;
  document.getElementById('correttaEsecuzioneBasamento').disabled=true;
  document.getElementById('rischioFulminazione').disabled=true;
  document.getElementById('denunciaMessaInServizioInail').disabled=true;
  document.getElementById('verificaPeriodicaInail').disabled=true;
  document.getElementById('ultimaVerificaPeriodicaASL').disabled=true;
  document.getElementById('scadenzaUltimaVerificaMezzoSubAffidataria').disabled=true;
  document.getElementById('verificaTrimestraleFuni').disabled=true;
  document.getElementById('scadenzaUltimaVerificaFuniMezzoSubAffidataria').disabled=true;
}}
0 голосов
/ 05 декабря 2018

У вас странное определение "еще".Почему вы ставите точку с запятой после своего «else»?

else;

Может быть, это источник вашей проблемы?

https://www.w3schools.com/js/js_if_else.asp

...