通过 Javascript 设置 HTML 元素的属性和样式

Question

I have this javascript which works perfectly because I'm using php and looping through lots of data which is best displayed with variables when radio buttons are clicked. See the code below:

<script type="text/javascript">

function transferamount() {
 <?php foreach ($wallets as $key => $wallet) : ?>
 if (document.getElementById('<?php echo $key?>').checked) {
 document.getElementById('if<?php echo $key?>').style.display = 'block';
}
else document.getElementById('if<?php echo $key?>').style.display = 'none';
 document.getElementById('if<?php echo $key?>').element.disabled = true;
<?php endforeach; ?>
}
</script>

The issue I am experiencing is being able to set both the attribute and style because I do not want the method = "post" to send all the data for the loop but only those displayed. I understand that some browsers will work perfectly even by setting the style to document.getElementById('elementId').style = "display:none;"but then I want to be extra sure that that is the case by setting the attributes of the undesired input elements to disable so that their values will not post. They all have the same attribute name and that's what I need. Thus name = "name" . There are some restrictions in the input, that's why I cannot just display one input element though they all have the same . How best can I tweak my JavaScript to achieve this? Thank you in advance.

Answer 1

I rather deleted the loop in the main HTML code and put it as element.innerHTML . Also I created a div with id="ElementId"

<style>
    function transferamount() {
      <?php foreach ($wallets as $key => $wallet) : ?>
      if (document.getElementById('<?php echo $key?>').checked) {
        document.getElementById('ElementId').innerHTML = "<div class='form-group'><label>Amount of <?php echo $wallet?></label><input name='amount' class='form-control' type='number' min='1.00' max='<?php echo ${$key} ?>' placeholder='<?php echo ${$key}?>'></div>";
      }
</style>

With this code, script works perfect. Also method = "post" works perfectly.