javascript(3tcl)

javascript 💖

okay bestie, welcome to javascript(3tcl) — yes it's the Tcl manual page, no we are not scared of it. This one lives in the HTML and Java Script Generation corner of the tcllib universe, and it's lowkey iconic. It's giving "procedures that make HTML and JavaScript structures for you so you don't have to hand-write a million tags." Periodt.

---

✨ NAME ✨

javascript — procedures to generate HTML and Java Script structures. that's it, that's the whole vibe. 🎀

---

🌸 SYNOPSIS 🌸

package require Tcl 8.5 9

package require javascript ?1.0.3?

::javascript::makeSelectorWidget  id  leftLabel leftValueList rightLabel
rightValueList rightNameList ?length? ?minWidth?

::javascript::makeSubmitButton name value

::javascript::makeProtectedSubmitButton name value msg

::javascript::makeMasterButton master value slavePattern boolean

::javascript::makeParentCheckbox parentName childName

::javascript::makeChildCheckbox parentName childName

---

💅 DESCRIPTION 💅

so the ::javascript package is a whole little collection of commands that generate HTML and Java Script code. and here's the part that trips people up, bestie — these commands return an HTML string as their result. they do not print it to stdout. like, they're handing you the goods, not yelling them into the void. iykyk. 🫶

• ::javascript::makeSelectorWidget id leftLabel leftValueList rightLabel rightValueList rightNameList ?length? ?minWidth? — builds the HTML for a dual-multi-selection megawidget. and yes, "megawidget" is the actual word, we love her. picture two multi-selection boxes chillin' side by side, separated by a left arrow and a right arrow button. the right arrow button moves everything selected in the left box over to the right box, and the left arrow button moves everything selected in the right box back to the left box. so basically a "keep / yeet" machine. 🦋

now the arguments, one by one, no skipping:

• id — the suffix of all HTML objects in this megawidget. all of them. every single one.
• leftLabel — the text that shows up above the left selection box.
• leftValueList — the values of the items in the left selection box.
• leftNameList — the names to appear in the left selection box.
• rightLabel — the text that shows up above the right selection box.
• rightValueList — the values of the items in the right selection box.
• rightNameList — the names to appear in the right selection box.
• length — optional, determines the number of elts to show before adding a vertical scrollbar. defaults to 8.
• minWidth — optional, the number of spaces used to determine the minimum box width. defaults to 32.

• ::javascript::makeSubmitButton name value — creates an HTML submit button that resets a hidden field for each registered multi-selection box. name is the name of the HTML button object to create. value is the label of the HTML button object to create. clean, simple, slays.
• ::javascript::makeProtectedSubmitButton name value msg — creates an HTML submit button that prompts the user with a continue/cancel shutdown warning before the form is submitted. like a lil "are you SURE bestie" popup, but for forms. 🙈 name is the name of the HTML button object to create. value is the label of the HTML button object to create. msg is the message to display when the button is pressed.
• ::javascript::makeMasterButton master value slavePattern boolean — creates an HTML button that sets its slave checkboxs to the boolean value. (yes, "checkboxs", we're keeping it, that's the original.) master is the name of the child's parent html checkbox object. value is the value of the master. slaves is the name of child html checkbox object to create. boolean is the java script boolean value that will be given to all the slaves — and listen, this one is strict: it must be "true" or "false". no cap. anything else and you're on your own. 💀
• ::javascript::makeParentCheckbox parentName childName — creates an HTML checkbox and ties its value to that of its child checkbox. if the parent is unchecked, the child is automatically unchecked. parentName is the name of parent html checkbox object to create. childName is the name of the parent's child html checkbox object. parent says no, child says no. iconic family dynamics. 👑
• ::javascript::makeChildCheckbox parentName childName — creates an HTML checkbox and ties its value to that of its parent checkbox. if the child is checked, the parent is automatically checked. parentName is the name of the child's parent html checkbox object. childName is the name of child html checkbox object to create. child says yes, parent gets dragged along. main character energy fr fr. ✨

---

😭 BUGS, IDEAS, FEEDBACK 😭

ngl, this document — and the package it describes — will undoubtedly contain bugs and other problems. we're being honest about it, that's growth. please report such in the category javascript of the Tcllib Trackers at [http://core.tcl.tk/tcllib/reportlist]. and if you've got ideas for enhancements for either the package and/or the documentation, report those too, bestie, we want them. 🫶

when proposing code changes, please provide unified diffs, i.e the output of diff -u. that's the love language here.

also note: attachments are strongly preferred over inlined patches. you can make an attachment by going to the Edit form of the ticket immediately after its creation, and then using the left-most button in the secondary navigation bar. that's the whole ritual. 🌈

---

🦋 SEE ALSO 🦋

• html
• ncgi

---

🍓 KEYWORDS 🍓

checkbox, html, javascript, selectionbox, submitbutton

---

⭐ CATEGORY ⭐

CGI programming

---

okay that's the whole page, you ate it, no crumbs left. 💖 this was javascript(3tcl) from tcllib, version 1.0.3, and yeah we're signing off right here. go make some HTML, bestie, you've got this. 🎀✨🦋