Databases
StackOverflow2013
Postsdbo
POHow can I make these javascript functions universally applicable to any desired element?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow can I make these javascript functions universally applicable to any desired element?
    primarykey
    data
    text
    <p>In the following code I want to reduce these 5 functions down to 3. </p> <p>The first function <code>toggle_visibility()</code> is already made universal by passing the id when I call the function from my html, however, I have to repeat the next two functions <code>thankYouText_Change()</code> and <code>resettxt()</code> because I don't know how to store the value of the <code>Item</code> variable, nor the <code>p</code> or <code>OK_button</code> variables and pass them to the next function so that they can be used by the other functions. </p> <p>My goal is to figure out how to reduce these to a set of 3 functions that can be accessed at anytime in my html and applied to any and all relevant elements simply by using <code>onClick="function_foo('desired_element_foo')</code>, without having to have a separate set of functions for each time I want to use them on a different element. </p> <p>I think that in order to do this I also need to know how to make the variables <code>p</code> and <code>OK_Button</code> have values that will automatically change and be stored based upon the id that I send to them/access them with.</p> <pre><code>function toggle_visibility(id) { var Item = document.getElementById(id); if (Item.style.display == 'block') { Item.style.display = 'none'; } else { Item.style.display = 'block'; } } function thankYouText_Change() { var p = document.getElementById("thanksForEmail"); var OK_Button = document.getElementById("okButton"); if (p.innerHTML == 'Thank you for submitting your e-mail.') { OK_Button.style.display = 'none'; p.innerHTML = "Returning to page..."; setTimeout("toggle_visibility('msgSend'), resettxt()", 500); } } function resettxt() { var p = document.getElementById("thanksForEmail"); var OK_Button = document.getElementById("okButton"); if (p.innerHTML == 'Returning to page...') { p.innerHTML = 'Thank you for submitting your e-mail.'; OK_Button.style.display = 'block'; } } //Start of repeated functions for second div and button elements function thankYouText_Change2() { var p = document.getElementById("thanksForEmail2"); var OK_Button = document.getElementById("okButton2"); if (p.innerHTML == 'Thank you for submitting your e-mail.') { OK_Button.style.display = 'none'; p.innerHTML = "Returning to page..."; setTimeout("toggle_visibility('msgSend2'), resettxt2()", 500); } } function resettxt2() { var p = document.getElementById("thanksForEmail2"); var OK_Button = document.getElementById("okButton2"); if (p.innerHTML == 'Returning to page...') { p.innerHTML = 'Thank you for submitting your e-mail.'; OK_Button.style.display = 'block'; } } </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USPointy
    1. USperson0
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload