This is my first post here! I'm a novice coder, at best, and I've been struggling with this problem. I want to take a multi-input form comprised mostly of check boxes, have the user, me, fill it out, and then click a "copy" button to copy the values to a clipboard. The only problem is that I can't figure out how to get all of the values or how to make checkbox values disappear if unchecked. I broke my code and I can't seem to figure out what I did wrong.
Can anyone help me figure this out and understand the error of my ways?
My current code: Ideally when the check box is unchecked, it will produce no value and the the other inputs will change based on selection/text input. When the button is pressed, the form data is copied to clipboard.
function getVal() {
var one = document.getElementById("form1").value;
document.getElementById("hiddenDiv").innerHTML =form1;
};
var copyTextareaBtn = document.querySelector('#button');
copyTextareaBtn.addEventListener('click', function(event) {
var copyTextarea = document.getElementById('hiddenDiv').innerHTML;
copyTextarea.select();
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
console.log('Copying text command was ' + msg);
} catch (err) {
console.log('Oops, unable to copy');
}
});
<head>
<title></title>
</head>
<body>
<div>
<form id="form1">
<input type="text" name="">
<select>
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
</select>
<input type="checkbox" name="" value="Yes" checked="">Yes
</form>
<div>
<button id="button" onclick="getVal()" >Copy</button>
</div>
</div>
<div id="hiddenDiv">
</div>
</body>
Aucun commentaire:
Enregistrer un commentaire