In ①, there is Javascript related to checkbox, and Javascript related to text in ②.
I would like to make it so that a submit is enabled on the condition that there is both a text entry and a check button check (text entry & check).
(Currently, (①) and (②) are operating individually and not together.
Using the Javascript in (①) as a basis, try to incorporate (②).
Best regards. We thank you for the answer that works.
<body>
<!--① Main Javascript Check box relationship-->
<script>
const paqeJAB='[name="OM[]"]';
document.addEventListener('change',({target})=>{
if(target.matches(paqeJAB)){
const love=document.querySelectorAll(`${paqeJAB}:checked`).length;
document.querySelector('[type=submit]').disabled=love==0;
document.querySelectorAll(`${paqeJAB}:not(:checked)`).forEach(xtre=>{
xtre.disabled=love>=3;
});
}
});
window.addEventListener('DOMContentLoaded', ()=>{
const els = new CustomEvent("HTMLEvents");
els.initEvent('change', true, true );
document.querySelector(paqeJAB).dispatchEvent(els);
});
</script>
<!--② Sub Javascript text relation-->
<script>
function manage(xXx) {
var bt = document.getElementById('btSubmit');/*Submit、id*/
if (txt.value != '')
if (ama.value != ''){
bt.disabled = false;}
else{
bt.disabled = true;}
};
</script>
<form>
<input type="text" id="txt" required onkeyup="manage(this)"/>
<input type="email" class="form-control" id="ama" name="email" required onkeyup="manage(this)"/>
<ul>
<li><input type="checkbox" id="OM1" name="OM[]" value="aaaa"></input>
<label for="OM1">aaaa</label></li>
<li><input type="checkbox" id="OM2" name="OM[]" value="bbbb"></input>
<label for="OM2">bbbb</label></li>
<li><input type="checkbox" id="OM3" name="OM[]" value="cccc"></input>
<label for="OM3">cccc</label></li>
<li><input type="checkbox" id="OM4" name="OM[]" value="eeee"></input>
<label for="OM4">eeee</label></li>
<li><input type="checkbox" id="OM5" name="OM[]" value="hhhh"></input>
<label for="OM5">hhhh</label></li>
</ul>
<button type="submit" id="btSubmit" disabled>send OK</button>
</form>
</body>