Обязательное поле для заполнеия

214

16 марта 2018, 12:58

Здравствуйте! Помогите реализовать следующий функционал: Есть форма, где нужно, чтобы после активного чекбокса (нажали на него) поле, находящееся в форме стало обязательным для заполнения. Буду очень признательна!

 <TD CLASS="browseItemName" NOWRAP VALIGN="TOP"> 
<INPUT TYPE="CHECKBOX" ID="_1_1_4_[LL_REPTAG=ROWNUM /]_5_1" NAME="_1_1_4_[LL_REPTAG=ROWNUM /]_5_1" value="1"  ONCLICK="EditPosition('_1_1_4_[LL_REPTAG=ROWNUM /]_7_1', '_1_1_4_[LL_REPTAG=ROWNUM /]_5_1');markDirty();"> 
</TD> 
<TD CLASS="browseItemName" NOWRAP VALIGN="TOP"> 
<TEXTAREA CLASS="valueEditable multiline rfield" ID="_1_1_4_[LL_REPTAG=ROWNUM /]_7_1" NAME="_1_1_4_[LL_REPTAG=ROWNUM /]_7_1" TITLE="Reason" WRAP="soft" ROWS="3" COLS="128" READONLY="TRUE" ONCHANGE="markDirty();"></TEXTAREA> 
</TD>

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

function EditPosition(chk) { 
  var edit = document.getElementById("test"); 
  if (chk.checked) 
    edit.setAttribute("required", true); 
  else 
    edit.removeAttribute("required"); 
}

<TD CLASS="browseItemName" NOWRAP VALIGN="TOP"> 
 
<INPUT TYPE="CHECKBOX" ID="_1_1_4_[LL_REPTAG=ROWNUM /]_5_1" NAME="_1_1_4_[LL_REPTAG=ROWNUM /]_5_1" value="1"  ONCLICK="EditPosition('_1_1_4_[LL_REPTAG=ROWNUM /]_7_1', '_1_1_4_[LL_REPTAG=ROWNUM /]_5_1');markDirty();" class="btn_submit disabled"> 
 
</TD> 
 
<TD CLASS="browseItemName" NOWRAP VALIGN="TOP" ID="test"> 
 
<TEXTAREA CLASS="valueEditable multiline rfield" ID="_1_1_4_[LL_REPTAG=ROWNUM /]_7_1" NAME="_1_1_4_[LL_REPTAG=ROWNUM /]_7_1" TITLE="Reason" WRAP="soft" ROWS="3" COLS="128" READONLY="TRUE" ONCHANGE="markDirty();"></TEXTAREA> 
</TD>

Answer 1

function updateRequired(chk) { 
  document.getElementById("test").required = chk.checked; 
}

input[required] 
{ 
  border: 1px red solid; 
}

<form> 
  <input type="checkbox" onclick="updateRequired(this)" /> 
  <input type="text" id="test" name="test" /> 
  <button type="submit">Submit</button> 
</form>

function EditPosition() { 
  // stub 
} 
function markDirty() { 
  // stub 
} 
 
$("tr td input[type='checkbox']").click(function(){ 
  var text = $(this).closest("tr").find("textarea"); 
  if (text.length > 0) { 
    text[0].required = this.checked; 
  } 
});

textarea[required] { 
  border: 1px solid red; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<form> 
<table border="1"> 
<tr> 
<TD CLASS="browseItemName" NOWRAP VALIGN="TOP"> 
<INPUT TYPE="CHECKBOX" ID="_1_1_4_[LL_REPTAG=ROWNUM /]_5_1" NAME="_1_1_4_[LL_REPTAG=ROWNUM /]_5_1" value="1"  ONCLICK="EditPosition('_1_1_4_[LL_REPTAG=ROWNUM /]_7_1', '_1_1_4_[LL_REPTAG=ROWNUM /]_5_1');markDirty();"/> 
</TD> 
<TD CLASS="browseItemName" NOWRAP VALIGN="TOP"> 
<TEXTAREA CLASS="valueEditable multiline rfield" ID="_1_1_4_[LL_REPTAG=ROWNUM /]_7_1" NAME="_1_1_4_[LL_REPTAG=ROWNUM /]_7_1" TITLE="Reason" WRAP="soft" ROWS="3" COLS="28" ONCHANGE="markDirty();" ></TEXTAREA> 
</TD> 
</tr> 
</table> 
<br/> 
<button type="submit">Submit</button> 
</form>

Обратите внимание на то, что я убрал READONLY="TRUE" из TEXTAREA.