How to get Poll Voting from comments with poll element?

Ask the community
, , ,
1

I’ve tried fetching the poll Data from backend dynamically using ricos to node translation ,


function processPollNode(node) {
    if (!node.pollData || !node.pollData.poll) {
        return '<div class="poll-placeholder">[Poll content]</div>';
    }
   
    const poll = node.pollData.poll;
    const title = poll.title || 'Poll';
    const options = poll.options || [];
    
    // Calculate total votes
    const totalVotes = options.reduce((sum, option) => sum + (option.votes || 0), 0);
   
    let pollHtml = `
        <div class="poll-container" style="border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; margin: 12px 0; background: #f9fafb;">
            <h4 class="poll-title" style="margin: 0 0 12px 0; font-weight: 600; color: #374151;">${escapeHtml(title)}</h4>
            <div class="poll-stats" style="font-size: 14px; color: #6b7280; margin-bottom: 12px;">
                Total votes: <span class="total-votes">${totalVotes}</span>
            </div>`;
   
    if (options.length > 0) {
        pollHtml += '<div class="poll-options">';
        options.forEach((option, index) => {
            const optionText = option.title || `Option ${index + 1}`;
            const voteCount = option.votes || 0;
            const percentage = totalVotes > 0 ? Math.round((voteCount / totalVotes) * 100) : 0;
            
            pollHtml += `
                <div class="poll-option" style="margin-bottom: 8px; position: relative; background: #fff; border: 1px solid #d1d5db; border-radius: 6px; overflow: hidden;">
                    <div class="poll-option-bar" style="background: linear-gradient(90deg, #3b82f6 0%, #1d4ed8 100%); height: 100%; width: ${percentage}%; position: absolute; opacity: 0.1; z-index: 1;"></div>
                    <div class="poll-option-content" style="padding: 12px; position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: center;">
                        <span class="option-text" style="font-weight: 500; color: #374151;">${escapeHtml(optionText)}</span>
                        <div class="option-stats" style="display: flex; align-items: center; gap: 8px;">
                            <span class="vote-count" style="font-weight: 600; color: #1f2937;">${voteCount}</span>
                            <span class="vote-percentage" style="font-size: 12px; color: #6b7280; min-width: 35px;">(${percentage}%)</span>
                        </div>
                    </div>
                </div>`;
        });
        pollHtml += '</div>';
    }
   
    pollHtml += `
            <div class="poll-refresh-hint" style="font-size: 12px; color: #9ca3af; font-style: italic; margin-top: 8px;">
                Vote counts update when comments are refreshed
            </div>
        </div>`;
    
    return pollHtml;
}

The Html returned ,what I found is both html format and ricos node format don’t have votes

pollData
: 
containerData
: 
{width: {…}, alignment: 'CENTER', textWrap: true}
design
: 
{poll: {…}, options: {…}}
layout
: 
{poll: {…}, options: {…}}
poll
: 
id
: 
"c50de5e6-312f-47b1-8ea3-3849d5b06b61"
image
: 
{src: {…}}
options
: 
Array(2)
0
: 
id
: 
"60cb4e92-efc0-4805-a6bc-a893fbe728ff"
image
: 
{src: {…}}
title
: 
"python"
[[Prototype]]
: 
Object
1
: 
id
: 
"9f4f0fa1-53fc-4f84-9bb9-954d1308f5f9"
image
: 
{src: {…}}
title
: 
"rust"
[[Prototype]]
: 
Object
length
: 
2
[[Prototype]]
: 
Array(0)
settings
: 
permissions
: 
{view: 'VOTERS', vote: 'ALL', allowMultipleVotes: false}
showVoters
: 
true
showVotesCount
: 
true
[[Prototype]]
: 
Object
title
: 
"Which Programming Language is the best for Web Security?"
[[Prototype]]
: 
Object
[[Prototype]]
: 
Object
type
: 
"POLL"
[[Prototype]]
: 
Object

Any solution to get poll data?