The script that I am doing must be in vanilla js, JQUERY cannot be used and unfortunately it must work in Internet Explorer...
It is a form. I am having problems with a textarea: first of all it is a textarea like any other and on the other hand it has some buttons that add text to this textarea.
Here comes the question: how can I validate that this textarea has been filled? My problem is that it must have text by default, so if its value is "" I get an error, it doesn't work, its content would have to be deleted by default so that the "fill in this field" error is raised. I had also thought of putting that if at least one of the buttons has been pressed, let it continue with the form, but I can't get it to work.
Someone could help me? I'm fine with one of the two ways I mentioned.
<script>
function addText(event) {
var targ = event.target || event.srcElement;
document.getElementById("descripcion").value += targ.textContent || targ.innerText;
}
</script>
<div>
<p>Descripción:</p>
<textarea class="descrip" id="descripcion" style="width:300px;height:100px" ><<<textos de implementacion>>>
<<<etiquetas de seguimiento>>>
</textarea>
<ul onclick="addText(event)" style="list-style-type: none; cursor:pointer;margin-left: -40px;width: 400px; ">
<table>
<tr>
<td>
<li id ="descaj" class="cajas" style="width:185px;border:1px solid black"> PROTOCOLO 1</li>
</td>
<td>
<li class="cajas" style="width:185px;border:1px solid black"> PROTOCOLO 2</li>
</td>
<td>
<li class="cajas" style="width:185px;border:1px solid black"> PROTOCOLO 3</li>
</td>
</tr>
</table>
</ul>
</div>
I gave you 2 examples that can give you an approach to find your solution. But in my experience these weird solutions always fail at some point. The best thing in your case is to create 2 textareas one for implementation texts and one for follow-ups and period, you can always join the texts. And those texts that go in there should go as labels to the outside. And if later you want the final text to include those default texts, you put them when you join them