Our pure JavaScript Scheduler component
hi,
is it possible to display all involved resources in an eventTooltip template?
note: to display the one assigned, I do this(simplified):
features: {
...
eventTooltip: {
template: data => `<dl>
<dt>Assigned to:</dt>
<dd>
${StringHelper.encodeHtml(data.eventRecord.resource.name)}
</dd>
</dl>`,
},
thanks, udo
nice! thank you marcio! (I also appreciate the docs link!)
note: I did not find element data.eventRecord.resources on console.log(). probably some magic involved
I now tried to iterate over the resources to display them in <div> s but they won't show. guess I'm missing something :
...
template: data => `<div>
<div>Assigned to:</div>
<div>
${StringHelper.encodeHtml(data.eventRecord.resources.map(r => r.id).join(', '))}
</div>
<br>
<div>Assigned to:</div>
<div>
<strong>No show :|</strong>
${data.eventRecord.resources.map(r => {
`<div>${StringHelper.encodeHtml(r.name)}</div>`
}).join('')}
</div>
</div>`,
...
do you have a suggestion how to get it to work?
thanks, udo
Hey udo,
In the second resources.map
, you have {}
but you don't have a return statement, that's why is not working, if you remove the {}
or add a return
statement, it works
<div>
<strong>No show :|</strong>
${data.eventRecord.resources.map(r =>
`<div>${StringHelper.encodeHtml(r.name)}</div>`
).join('')}
</div>
or
<div>
<strong>No show :|</strong>
${data.eventRecord.resources.map(r => {
return `<div>${StringHelper.encodeHtml(r.name)}</div>`
}).join('')}
</div>
thank you marcio. yes. apologies for this
sorry marcio for bugging you with the following :| (in the same context)
is there a possibility to order the resources alphabetically (by key name )?
I tried the following without success:
${data.eventRecord.resources.sort((a, b) => (a.name > b.name)).map(r => `<div>${StringHelper.encodeHtml(r.name)}</div>`).join('')}
note: guess that data.eventRecord.resources is immutable and is not changed.
Why don't you try to sort
after map
?
Btw, template
is a method. So you can add more code before return template code and do whatever you need.
I first have to sort and then map (output the result). otherwise it is not working... (or I misunderstood what you mean)
I would like to implement similar to this -> viewtopic.php?p=117206#p117206
if there are alternatives how to do it, an example would help...
thanks, udo
Hey udo,
You're looking for this to sort it
${
data.eventRecord.resources.sort(
(a, b) => a.name.localeCompare(b.name)
).map(r =>
`<div>${StringHelper.encodeHtml(r.name)}</div>`
).join('')
}