Repeating Items: Change text based on a combobox

I am currently trying to create a spell list that is compiled based on a choice in a combobox (i.e. select and option). The idea is simple: I select a spell in a combobox and some values are automatically written (such as range, aoe, save,...). My attempt is to put in each option value a string with different values, separated by a defined separator. In the onchange function I "decode" the string and I put each value in the proper input. In pure HTML/JS works perfectly (I use JSFiddle for testing, and works as expected), but I was not able to make it working in a repeating items section in a character sheet. My hipoteses are: - the main one: the IDs I refer to in my script are not valid in a fieldset, since they have the same ID in each row - the js script does not work in the same way in a character sheet I put a portion of my HTML/scripts. The select: <select onchange="myFunction(event)"> <option value='Aid|5|None|Touch|1 + 1 per level|1 creature'>Aid</option> <option value='Augury|2 rds.|None|0|Special|Special'>Augury</option> <option value='Barkskin|5|None|Touch|4+ 1 per level rds.|1 creature'>Barkskin</option> ad so on, here I copied only the first lines, as you can imagine the list is longer. Then the script: function myFunction(e) {     var arr = []; arr = e.target.value.split('|'); document.getElementById("spellname").value = arr[0]; document.getElementById("casttime").value = arr[1]; document.getElementById("save").value = arr[2]; document.getElementById("range").value = arr[3]; document.getElementById("duration").value = arr[4]; document.getElementById("aoe").value = arr[5]; } Obviously I have some input with the proper ID in the HTML. Any suggestion? Even a totally different way to do it, maybe with the main difference that it works. Thank you.

You cant use ids on roll20. This is because ids have to be unique, and they cant be on roll20 - because you have multiple copies of a character sheet. Secondly, you cant use javascript like this document.getElementById("spellname").value = arr[0]; or this <select onchange="myFunction(event)"> on roll20. The only javascript you can use on a character sheet is that allowed in sheet workers. Sheet workers have no access to the DOM - all they can do is change attribute values. This is why testing on jsfiddle and similar places has limited benefit for roll20 - you need to test in the application itself. Your account isnt Pro - do you have access to a Pro account to be able to edit custom sheets? If you do, you can easily do what you want, and there are better ways to do it. Is this in a repeating section or just a set of separate attributes?

If its not a repeating section, you can do this on('change:spellname', event => {     const spelldetails = {         Aid: {spellcasttime: '5', spellsave: 'None', spellrange: 'Touch', spellduration: '1 + 1 per level', spellaoe: '1 creature'},         Augury: {spellcasttime: '2 rds.', spellsave: 'None', spellrange: '0', spellduration: 'Special', spellaoe: 'Special'},     };     getAttrs(['spellname'], values => {         let name = values.spellname;         let output = spelldetails[name] || '';         if(output) setAttrs(output);     }); }); some assumptions here: your select is like this: <select name="attr_spellname"> <option >Aid</option> <option >Augury</option> <option >Barkskin</option> </select> Secondly you have a set of inputs to take the spell details, named exactly as above:  <input name="spellsave" /> <input name="spellaoe" /> etc. Then when you select a spell, the sheet worker will run, and get the details from the spelldetails variable and update all the relevant attributes in one fell swoop.

Wow, thanks, I still have to learn a lot of things on roll20! I also love your solution with the constant, more elegant and easier to mantain. So: both my hipoteses were true, things work differently in roll20 and repeating items are a pain to use. Since you wrote "If its not a repeating section", is this meaning that it is not feasible in this case? I would like to use this in a spell repeating section. Otherwise...  I have to find another creative solution :)

Sorry, I forgot part of the answer: I'm not a pro, but I write some changes with a friend who is. Not the easiest way to manage things, I know.

It is possible to do with a repeating section, but the code is a bit less straightforward. I'll post a version that works for that shortly.

Here's the simplest way to do it as a repeating section on('change:repeating_spells:spellname', event => {     // build a data object full of the spell details     // use exactly this format:      const spelldetails = {         'unknown': {repeating_spells_casttime: '', repeating_spells_save: '', repeating_spells_range: '', repeating_spells_duration: '', repeating_spells_aoe: ''},         Aid: {repeating_spells_casttime: '5', repeating_spells_save: 'None', repeating_spells_range: 'Touch', repeating_spells_duration: '1 + 1 per level', repeating_spells_aoe: '1 creature'},         Augury: {repeating_spells_casttime: '2 rds.', repeating_spells_save: 'None', repeating_spells_range: '0', repeating_spells_duration: 'Special', repeating_spells_aoe: 'Special'},     };     getAttrs(['repeating_spells_spellname'], values => {         let name = values.repeating_spells_spellname;         let output = spelldetails[name] || spelldetails.unknown;         setAttrs(output);     }); }); note the longer names in the spelldetails constant. You dont have to do it this way, but its the most compact code. I also changed the let output and setAttrs lines to properly account for names that aren't recognised (this mostly happens when you create a new row in the repeating section, and the spellname is empty). In this case, it will set all the spell details attributes to ''.

Here's a version which allows you to keep the shorter property names in the spelldetails: on('change:repeating_spells:spellname', event => {     // build a data object full of the spell details     // use exactly this format:      const spelldetails = {         unknown: {casttime: '', save: '', range: '', duration: '', aoe: ''},         Aid: {casttime: '5', save: 'None', range: 'Touch', duration: '1 + 1 per level', aoe: '1 creature'},         Augury: {casttime: '2 rds.', save: 'None', range: '0', duration: 'Special', aoe: 'Special'},     };     getAttrs(['repeating_spells_spellname'], values => {         let name = values.repeating_spells_spellname;         let output = spelldetails[name] || spelldetails.unknown;         // now loop though the properties of the spell, and update the property name         Object.keys(output).forEach(key => {             output[`repeating_spells_${key}`] = output[key];             delete output[key];         });         setAttrs(output);     }); }); Also corrected an oversight in the previous posts code (fixed there too). I had let name = values.spellname; instead of let name = values.repeating_spells_spellname;

You are great, it works! I have no idea why, the first time it didn't work, so I decided to add only one field, and it worked, then the second, the third,... and at the end worked without any changes. It was as spell also the implementation :) Thank you very much, I think I would never reached a solution without your help.

You're welcome :)  have no idea why, the first time it didn't work,  Just in case - try creating a new character and see if there's any strangeness. If so, report back with as much information as you can about how its not working, and we'll fix it.

As I told you, it's magic, now everything works perfectly. I just need to write the constant, nothing that a combination of Excel and copy&paste cannot manage :) Thank you again for your amazing support.