I am using a checkbox in a table that has more than 1 row and checkbox functionality is working only in the first one

Viewed 33

I have a checkbox in my table inside my view page that is getting the values for the table from my database, the problem is the checkbox functionality is only working in the first row I do not know why. I am trying to send more than one attribute using the checkbox checked method but it always gives me an error.

here is my view hbs code: [table code]

 {{#each users}}
                    
                        <tr>
                            <td>{{id}}</td> 
                            <td>{{name}}</td>
                            <td> {{email}} </td>
                            <td> <input type="checkbox" id="checkAddress" name="checkAddress" onclick="showAddress()"> {{publickey}} </td>
                            <p id="Address1" style="display:none">{{publickey}} </p>  
                            <td> {{is_verified}} </td>
                        </tr>
                    
                            
                        {{else}}
                        {
                        
                        <tr>
                            <td colspan="5">No Data Found</td>
                        </tr>
                        
                        }
                        {{/each}}

[input field code]

<form action="/auth/registerAddress" method="POST"> 

        <div class="form-group">
          <label for="fetchAccountFromHtml">Voters Registration</label><br><br> 
          <input id="fetchAccountFromHtml" name="fetchAccountFromHtml" class="form-control" type="text"> 
          <input id="fetchAccountFromHtml1" name="fetchAccountFromHtml1" class="form-control" type="text"> 
          <p id="Address1" style="display:none">{{publickey}} </p>
        </div>


<button type="submit" class="btn btn-primary">Register User</button>
    </form>  
    </div> 

[Function ShowAddress]

function showAddress() {
// Get the checkbox
var checkBox = document.getElementById("checkAddress");
// Get the output text
var text = document.getElementById("Address1");
// If the checkbox is checked, display the output text
if (checkBox.checked == true){
  document.getElementById("fetchAccountFromHtml").value = document.getElementById("Address1").innerHTML;
} else {
   document.getElementById("fetchAccountFromHtml").value = "";
}

}

[Auth Controller code]

 exports.registerAddress = (req, res) =>{
try { //this function try a code if everything goes well will run query, if there is an error catch it
    const { fetchAccountFromHtml} = req.body; //take the name and pwd from the request body
    if ( !fetchAccountFromHtml){
        return res.status(400).render('users', {
            message: 'Please fill in all the required fields'
        })
    }else {
        console.log( fetchAccountFromHtml);

}
} catch (error) {
    console.log(error);
}

here is my view page also and I am only getting the value for the first row inside my input field but not for the second one too.

I checked the first row and the address is shown in the input field

I checked the second row and the address did not show in the input field

I checked both of them and also only the first one is shown

I want to show both of them in the input field any help, please?

0 Answers
Related