Use variable in text for droplist

jasonadal · September 12, 2017

Is there a way to add a variable as part of an item in a drop list? Using the VAR when entering the text did not work. Looking at the element in the Chrome console, I was able to see the <option value> tag, but haven't much clue how to change it from flat text to a combination of flat text and the variable.

Hopefully it's something simpler than creating a full blown drop down from scratch, as that's a bit over my head at least for now.

klaatu · September 12, 2017

If I am understanding you correctly, you want to have a variable determine the value and text of an option in a drop down, correct? Yup, you can do it (with jQuery).

$('option:nth-child(1)').attr('value',VarVariable1.getValue()).text(VarVariable1.getValue());

This will change whatever the first option is (it doesn't matter) to the value of variable1.

Darrel

klaatu · September 12, 2017

By the way, remember that you MUST initialize (use) the variable before it can be manipulated into the select element. Forgot to mention that although my example has it in there.

jasonadal · September 12, 2017

Edit: Is there a way to target just one drop down when there is more than one on the page? A quick google search suggests that I may need to add a class to the drop down to target it with jquery, but I'm not sure I grasp where/how to add the class in the RunJS or if more language is needed.

I think that will do it, actually - The goal was to have the option read "Text text text <variable value>" In my case, I'm setting a fixed date (assess_date) at the beginning of the course that needs to be added to the end of fixed text. I just fiddled a bit with the sample and think I have the gist enough that I'll be able to implement.

Once again, thank you! BTW - did you get my email message?

klaatu · September 12, 2017

Yeah, you can have as many drop downs as you'd like and specifically target any or all of them. Lectora provides class names and ID's to to each select element so there's no need to add any of that. You'll have to append the target by adding additional specificity. I just replied to your email. I would have missed it in hundreds of other emails if you had not mentioned anything. Thank you. Feel free to email me for more on this if you want. I'll look out for this one.

Darrel

jasonadal · September 13, 2017

With a little more research, I got it! It was just a matter of learning how to add the element id and whether it needed 'id' on the end of the element or not. From there, it was just remembering that I needed the # in front of it, and viola:

$('#combo258138 option:nth-child(2)').attr('value',VarVariable1.getValue()).text(VarVariable1.getValue());

Thanks again for all your help and pushing me at least baby steps into the world of JS and jquery.

klaatu · September 13, 2017

Awesome. Great job! Keep going.

Use variable in text for droplist

Comments

Categories