Populating bootbox.js prompt with django context data

Question

What i'm trying to do is get the textvalue in the prompt to match with the data being received from the view. The bootbox.js looks like this:

<script>
$('#playGameBtn').click(function(){
  bootbox.prompt({
    title: "Please select players for this match",
    value: ['1', '3'],
    inputType: 'checkbox',

    inputOptions: [{
        text: '{{standing.player_name}}',
        value: '1',
    },
    {
        text: 'Choice Two',
        value: '2',
    },
    {
        text: 'Choice Three',
        value: '3',
    }],
    callback: function (result) {
        console.log(result);
    }
});

}

)
</script>

What I have tried is this:

<script>
  {%for standing in standings%}
$('#playGameBtn').click(function(){
  bootbox.prompt({
    title: "Please select players for this match",
    value: ['1', '3'],
    inputType: 'checkbox',

    inputOptions: [{
        text: '{{standing.player_name}}',
        value: '1',
    },
    {
        text: 'Choice Two',
        value: '2',
    },
    {
        text: 'Choice Three',
        value: '3',
    }],
    callback: function (result) {
        console.log(result);
    }
});

}

)
{%endfor%}
</script>

But this just shows the same prompt multiple times with a different name each time.

Answer 1

Your loop is creating same javascript for initializing bootbox again and again. You just have to loop for options. like this

<script>
  $('#playGameBtn').click(function () {
      bootbox.prompt({
        title: "Please select players for this match",
        value: ['1', '3'],
        inputType: 'checkbox',

        inputOptions: [
          {% for standing in standings %}
            {
              text: '{{standing.player_name}}',
              value: '{{ forloop.counter }}'
            },
          {% endfor %}
        ],
        callback: function (result) {
          console.log(result)
        }
      })

    }
  )
</script>