CODEWITHSUNDEEP
pythonjquerydjangobootbox
Reez0
Reez0

Reputation: 2689

Populating bootbox.js prompt with django context data

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.

Upvotes: 0

Views: 126

Answers (1)

Nafees Anwar
Nafees Anwar

Reputation: 6608

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>

Upvotes: 2

Related Questions