CODEWITHSUNDEEP
javascriptparameters
card51short
card51short

Reputation: 143

Adding paramaters for an onclick function inside an element

Hey guys I'm having an issue with the syntax of providing a parameter for a function that I call on an onclick event inside a div.

I can get the function open_email() to call but not when I add a parameter since the parameter I am looking to add is obtained from another form element and I'm not sure how to type it properly.

Below is my code. Please let me know if you know how it should be written. I'm currently getting nothing to happen unless I keep the parameters (arguments) blank.

To clarify, I need to know how to add emails[index].id as an argument for the function below that is called open_email(). What is the proper syntax? I tried : open_email(emails[index].id) and open_email("emails[index].id")

 for (index = 0; index < emails.length; index++) {
      if (emails[index].read == false) {
        element.innerHTML += '<div class="emails unread" onclick="open_email();">' + "From:" + JSON.stringify(emails[index].sender) +
          "<p class='subject'>" + "Subject: " + JSON.stringify(emails[index].subject) + "</p>" + JSON.stringify(emails[index].timestamp) + '</div>';
      } else {
        element.innerHTML += '<div class="emails">' + "From:" + JSON.stringify(emails[index].sender) +
          "<p>" + "Subject: " + JSON.stringify(emails[index].subject) + "</p>" + JSON.stringify(emails[index].timestamp) + '</div>';
      }

Upvotes: 0

Views: 289

Answers (1)

IvanD
IvanD

Reputation: 2953

Yes, you can. You need to send an arrow function there. Try to click on the text "Initial Content".

I do not have your open_email function, so I made up one as an example.

Basically, onclick will execute () => open_email(emailIndexId):

<div id="text">Initial Content</div>
<script>
  textDiv = document.getElementById('text');

  const open_email = id => {
    textDiv.innerText = "Sent email to " + id;
  }

  const emailIndexId = 33;

  textDiv.onclick = () => open_email(emailIndexId) // IMPORTANT
</script>

Upvotes: 1

Related Questions