title: change js confirm to a twitter bootstrap modal
body: <p>I have some JavaScript that displays a confirm dialog box to the user to confirm their action with passed in variables.</p>
  
  <p>However, I must change the plain confirm dialog to a twitter-bootstrap modal.</p>
  
  <p>I have tried several times, read a lot of SO posts and read the twitter bootstrap docs, but I cannot get it to work as my knowledge of js is not good enough. I am getting stuck on the display of the variables in the twitter bootstrap modal.</p>
  
  <p>I am hoping that some one can help me out by giving me some pointers.</p>
  
  <p>Here is my current js dialog code:</p>
  
  <pre><code>    function checkboxUpdated(checkbox, count, label, id) {
  
          if (checkbox.checked) {
  
              $('#menu_entry_' + id).show();
  
          } else {
  
              if (count &gt; 0) {
  
                  if (! confirm('{% trans "You have '+ count +' saved '+ label +'.\n\nIf you leave this option un-checked your saved '+ label +' will be deleted only after you update this page.\n\nAre you sure you want to delete your ' + count + ' saved ' + label +'?" %}')) {
  
                      checkbox.checked = true;
                      return;
  
                  }
  
              }
  
              $('#menu_entry_' + id).hide();
  
          }
  
      }
  </code></pre>
  
  <p><strong>EDIT: ADDED CODE OF #menu_entry_ as requested in comment:</strong></p>
  
  <pre><code>{% for id, menu_entry, selected, item_count in menu_entries %}
  
      &lt;li id="menu_entry_{{ id }}" {% if not selected %}style="display:none;"{% endif %}&gt;
  
          &lt;a 
  
              {% if id == 4 %}
  
                  href="{% url summary_details %}"
  
              {% elif id == 8 %}
  
                  href="{% url objective_details %}"
  
              {% elif id == 12 %}
  
                  href="{% url leading_employment_details %}"
  
              {% elif id == 16 %}
  
                  href="{% url desired_occupation_details %}"
  
              ....
  
              {% elif id == 112 %}
  
                  href="/"
  
              {% else %}
  
              href="/"
  
              {% endif %}
  
              onclick="showProgressAnimation();"&gt;
  </code></pre>
  
  <p><strong>Note that I need to transform the following js confirm code to twitter bootstrap modal code:</strong></p>
  
  <pre><code>if (! confirm('{% trans "You have '+ count +' saved '+ label +'.\n\nIf you leave this option un-checked your saved '+ label +' will be deleted only after you update this page.\n\nAre you sure you want to delete your ' + count + ' saved ' + label +'?" %}')) {
  </code></pre>