I need help with HTML prompt that would ask for a menu of choices that is screen size wide and long, contain two choice in each one of the four columns.
Here is what I came up with so far, but it does not seem to work well:
Your opening <html> tag comes too late, you've got two opening <head> tags, the first style block lacks a closing tag, you don't close the body or html sections (although there may be some code missing), putting an h2 directly inside a ul element is invalid markup, and there's no sign of a form.
While web engines will do their best to render a page, and so will cope with the mistakes, it'll take you into "undefined behaviour" territory -- so start by fixing those.
In what ways does it not "work well"? A mocked-up image of what you'd like to have happen would be useful here.
@Nige_S, appreciate your comments. I can certainly make several changes you are suggesting, but I doubt that I can write the html script that will actually work. I've been learning bits and pieces of html coding, but clearly not enough to be successful.
I was inspired to ask for help by this post by @RogerW and @mrpasini help to fix his html code. I was hoping someone can help me to fix my html code, so I can built on it to create the following html menu:
Since there are 4 columns and multiple items, I was hoping to just start with 2 items per column to make it easy.
I am planning to use variables from the html code menu (checkmarks by each item) to be used in KBM script - this part I probably can accomplish myself.
Alternatively I am would happy to continue learning and make one change at the time, if it is easier path.
Roger did me the courtesy of sharing his macro and being explicit about what he wanted. It would help your cause to share those four columns of options and explain how the columns should be limited to two choices when they clearly have multiple sections.
So don't worry about code, explain how you want the menu to function. But share the text so it doesn't have to be keyboarded.
@mrpasini I currently have multiple KBM macros which are triggered by mouse clicking on each one of the items on the palette on the screenshot. I can only choose one item at the time with the current set-up. Once clicked, macro chooses the corresponding items in the Electronic Medical Record (EMR) order list - a long list of options by scrolling down the list x times (this variable is different for each item clicked). It's little oversimplified, but hopefully it makes sense. EMR is reached via citrix and thus I have very limited options to create macros with KBM. Making one choice at the time and waiting for each macro to complete prior to choosing another one is cumbersome and takes too much time.
I am hopeful to create an html menu with checkboxes instead of this palette . I'd click on as many or as few of check boxes as needed, then click "order" or "enter" button and the bottom of the menu and let all the macros run sequentially one at the time after that. I am thinking I'd assign a variable to each checkbox, then check whether each one of these have "0" or "1" value, and execute macros for the checkboxes with value "1".
Hope it makes sense. I am hopeful that if you can show me how to make an html menu with just 4 columns with a couple of checkboxes in each, I can take it from there and populate the rest.
Here are a few macros as example, but I think these would just muddy the water.
I'm in a similar position, only a couple of pages ahead of you!
That's helpful -- and instantly provokes a question. The layout, particularly the widowed "heading" at the bottom of column 1, implies a "desktop publishing" type of text flow through your columns, where adding something to the middle of column 1 will push the last item to the top of 2 (which pushes the last of 2 to the top of 3, etc). Is that requirement, or just how it turned out? Is, perhaps, the list being generated on the fly? It'll be a lot easier if it isn't, and you can hard-code it (with sensible breaks!).
Edit to add:
So, as I'm trying to learn this stuff, here's a stab at a Prompt that borrows from @mrpasini's. I've used fieldsets rather than headings to group sections together, forced the window to full-screen, and jammed the buttons down to the bottom-right. labels work properly, allowing your users to click the box or the label to select an item.
I used local variables, but had to change my normal Local_variableName to localVariableName because of the "space to underline" (and vice versa) conversion when moving between KM and the web form -- mentioning it because that caught me out for a while
I've tried to include things you've shown in your image, like an horizontal divider within a section, so hopefully you'll be able to build out from it, style it to your own liking, etc.
I won't claim the coding is particularly good, but it helped me learn some stuff and might give you some ideas.
If you can learn by podcast, have listen to the "Programming By Stealth" series -- you'll find the introduction here and can subscribe via the usual services. It starts with the basics of HTML, moves through CSS and basic JavaScript, and so on. Good show notes, and after the first few shows there are "assignments" at the end of each that are then discussed in the next.
You are absolutely correct @Nige_S - the list was generated on the fly and I hated how a new item would push the whole layout around, requiring correction etc.
Your solution using fieldsets (first time I hear about these) is fantastic, and perfect for my application.
I am also very happy with clickable labels and dividers. This is really above an beyond what I've expected. Very thankful for your and @mrpasini 's help.
@mrpasini I've been trying to figure out how to include a code into this HTML that would allow me to press return key and it will be interpreted as a click the OK button. I've found multiple different solutions on the web and can see how it works, but am unable to apply it to my particular HTML, designed by you.
<script>
function KMInit(){window.addEventListener("keydown",function(e){e.preventDefault();if(e.code=='Enter'){window.KeyboardMaestro.Submit('OK');}});}
</script>
