I am trying to do a form validation WITHOUT jquery. I have found this code, but I am not sure how to convert it from Jquery to plain Javascript. I found this code here
$('.clickme').click(function() {
alert($(this).prev().val())
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="hidden" name="myvalue" class="form-control input_text" value="aaa" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="bbb" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="ccc" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="ddd" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="eee" />
<input type="button" class="clickme" value="Get Value" />Any help with this would be amazing. I have multiple forms in one HTML file, all with the same input variables, and I need the functions to only run for when that specific input button is clicked.
The below JS code should do the job :
document.querySelectorAll('.clickme').forEach(ele => {
ele.addEventListener('click', () => alert(ele.previousElementSibling.value))
});
Need to loop through all elements with class "click me" and add a click event to them
document.querySelectorAll('.clickme').forEach(ele => {
ele.addEventListener('click', () => alert(ele.previousElementSibling.value))
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="hidden" name="myvalue" class="form-control input_text" value="aaa" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="bbb" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="ccc" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="ddd" />
<input type="button" class="clickme" value="Get Value" />
<input type="hidden" name="myvalue" class="form-control input_text" value="eee" />
<input type="button" class="clickme" value="Get Value" />