LOE
League of Extraordinary FoundryVTT Developerssnagov

changing id for messages in the chat

Hello, I'm trying to build a system for foundry and i'm facing a issue when i create more than one message in the chat. those messages are cards that show options for a skill. the options are some radio buttons, and i'm using labels with the radios. basically the radio has an id, and the label has that id in the tag for. when more than one message is in the chat, since the for is always the same, i can't select items for the old message. is there an option to call new ChatMessage() and only after that create the message? i would like to grab the timestamp from ChatMessage to make each id unique. example: 
{{#each fields as |fd key|}}
    <input type="radio" class="field-option" data-key="{{key}}" id="{{key}}" name="field" value="{{fd.value}}">
    <label for="{{key}}">{{fd.label}}</label>
{{/each}}
{{#each fields as |fd key|}}
    <input type="radio" class="field-option" data-key="{{key}}" id="{{key}}" name="field" value="{{fd.value}}">
    <label for="{{key}}">{{fd.label}}</label>
{{/each}}
I would like to have something like 
{{#each fields as |fd key|}}
    <input type="radio" class="field-option" data-key="{{key}}" id="{{key}}-{{timestamp}}" name="field" value="{{fd.value}}">
    <label for="{{key}}-{{timestamp}}">{{fd.label}}</label>
{{/each}}
{{#each fields as |fd key|}}
    <input type="radio" class="field-option" data-key="{{key}}" id="{{key}}-{{timestamp}}" name="field" value="{{fd.value}}">
    <label for="{{key}}-{{timestamp}}">{{fd.label}}</label>
{{/each}}
in the JS I have the line below 
ChatMessage.create({
    speaker: ChatMessage.getSpeaker({ actor: this.actor }),
    flavor: html
  })
  
ChatMessage.create({
    speaker: ChatMessage.getSpeaker({ actor: this.actor }),
    flavor: html
  })
i'm wondering if it's possible to have something like: 
  const msg = new ChatMessage()
  ...
  i will add the timestamp to the tag elements here
  ...
  msg.create({
    speaker: ChatMessage.getSpeaker({ actor: this.actor }),
    flavor: html
  })
  const msg = new ChatMessage()
  ...
  i will add the timestamp to the tag elements here
  ...
  msg.create({
    speaker: ChatMessage.getSpeaker({ actor: this.actor }),
    flavor: html
  })
of course, if there is a best practice for this and it's different from my approach please let me know, otherwise i would like to validate i can create the class before the message. thank you
S
snagov•16d ago
i've found a work around. using ChatMessage.create({ ..... }).then( ) and inside the then using the method update
C
CussaMitre•16d ago
Just one thing: you could use the flags to do that, no? Create your own id, and add that on the flags? And then, when you are using the chat card to do something else, you could validate that only inside that card, not all the messages?
S
snagov•16d ago
The issue is more related to this: first message has a group of radio buttons with name field. Basically it means I can select only one item in this group. If I click on the label that has thr for="bla" it will select the input with id bla. When a new message appears in the chat, same radio group with same names. When I click on the label with for="bla", there are 2 radio buttons with same id. It selects one and remove the selection from the previous group. Indeed to processes de data don't make difference because I'm processing the content of the message. The issue is only on the html level. For example, if I have 2 messages, I select the label in the second label, it will mark the radio in the second label and remove the checked from the first message. If a player click on the button in the first message, there will be no radio button selected. To make clear, the button is another button that call the function that pull the data from the message. Not the radio button itself but a kind of submit button. Is that make sense?
C
CussaMitre•16d ago
How are you rendering the template to html? Because you could generate your id before rendering, and passing that Id as part of the context for rendering
M
Mana•13d ago
As general advice, do not use id property at all unless you're in control of everything on the webpage (with Foundry you never are), since id is supposed to be unique across the entire webpage.
Want results from more Discord servers?
Add your server
More Posts
Altering Status EffectsI have been trying for some time now to made modifications to the Foundry active effects, but to eveDo some copy paste, follow the guide, add a new coustom dice, earn some money.I am looking for someone who would make a minor modification (adding +1 die) in to an already existchange token lighting based on changing value on actor or an Effect embedded on the actor.I'm attempting to add a feature to my system that makes the token glow when it's lightsaber/generic GitHub Actions on releaseHi there, hope I'm at the right place. I'm actually new to actions on GitHub, trying for release- dUsing an array in a sheet templateIn the system I am creating, the progression of a skill category is handled with a fixed size array hook preCreateToken update token nameI'm trying to update the token name when dropping a token on a scene. I basically have something lempty packSo I'm trying to access a pack in my module and it does exist but it's empty. My thoughts are 1. TError on package installError message ``` Error: Cannot read properties of null (reading 'protected') ``` I've started up Absolutely new to all of this, need help with a silly query.Hello! I'm extremely new to all of this, and i'm having issues trying to understand how to code a waHi, friends! I'd like to build a moduleHi, friends! I'd like to build a module and I could use a shove in the right part of the docs to go Well now I'm downloading lancerWell now I'm downloading lancerNew Entertainer - Fantasy if not Table Top ---- yetMy grandson is 11, and he has started making video shorts. This is his first full length YouTube stBoilerplate.css fileHi I started a new system from the Boilerplate system, and am having an issue seeing updates from myNewbie question on scopeHey there, total newbie here. I'm a complete amateur to programming. I've completed the todo tutoria