title: Send button with certain features
body: <h1>Javascript</h1>
  
  <pre><code>$(function(){
    $('.select-another-button').each(function(){
      $(this).bind('click', function(e) {
        $(this).attr('disabled','true'); //disables the button
        $('#overlay').show(); //after disabling show the overlay for hover
        setTimeout(function(){ 
          $(this).attr('disabled','false'); //enables after 5mins
          $('#overlay').hide(); //hide the overlay
        }, 300000);
        e.preventDefault();
        fileBrowser(this);
        return false;
      });
    });
  });
  
  $("#overlay").hover(function(){
      $('#message').show();
  },function(){
      $('#message').hide();
  });
  </code></pre>
  
  <h1>CSS</h1>
  
  <pre><code>.title-actions {
    float: right;
    height: 50px;
    margin-top: 13px; }
    .title-actions a {
      transition: background 0.3s ease; }
      .title-actions a.btn {
        padding: 2px 14px;
        line-height: 26px;
        max-height: 28px;
        position: relative;
        top: -1px;
        margin-left: 8px; }
      .title-actions a:hover {
        background: #4382b5; }
    .title-actions span {
      color: #444;
      background: #e6e6e6;
      padding: 6px 10px;
      border-radius: 3px;
      float: none;
      position: relative;
      margin-left: 6px; }
    .title-actions .btn {
      padding: 2px 14px;
      line-height: 26px;
      max-height: 28px;
      position: relative;
      top: -1px;
      margin-left: 8px; }
    .title-actions .btn-icon {
      background: transparent;
      position: relative;il 
      color: #3e5366;
      text-align: center;
      display: inline-block;
      padding: 0 !important;
      transition: color 0.3s ease;
      box-shadow: none !important;
      margin-top: -16px;
      margin-left: 6px; }
      .title-actions .btn-icon i {
        font-size: 35px;
        line-height: 20px;
        position: relative;
        top: 12px; }
      .title-actions .btn-icon:hover {
        color: #4382b5;
        background: transparent; }
    .title-actions .badge .material-icons {
      font-size: 1.2em;
      line-height: 0;
      position: relative;
      top: 4px; }
  .wrapper {
      display: inline-block;
  }
  </code></pre>
  
  <h1>HTML</h1>
  
  <pre><code>    &lt;div class="wrapper"&gt;
          &lt;div id="overlay"&gt;&lt;/div&gt;
          &lt;a href="#"
             title="{% trans "Send email - rejected file(s)" %}"
             class="btn btn-icon select-another-button"
             data-url="{% url "messaging:send" request_id=object.pk %}"&gt;
              &lt;i class="material-icons"&gt;assignment_late&lt;/i&gt;
              &lt;div class='alert alert-success' id='send-message' style="display: none;"&gt;
                  &lt;p&gt;
                  The message was sent to the client. Please wait 5 minutes &lt;br&gt; before sending the message again.
                  &lt;/p&gt;
              &lt;/div&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  </code></pre>
  
  <h1>Django</h1>
  
  <p>I have this in my urls.py file</p>
  
  <pre><code>app_name = 'messaging'
  urlpatterns = [
      ...
  
      url(r'^send/(?P&lt;request_id&gt;[0-9]+)/$',
          send, name='send'),
  ]
  </code></pre>
  
  <p>The django's method is Send button with certain features</p>
  
  <pre><code>@staff_member_required
  @csrf_exempt
  def send(request, request_id=None):
      req= Request.objects.get(pk=request_id)
      request_folders = req.folder.all_files.all()
      context = []
  
      for doc in request_folders:
          if doc.meta.state == u'rejected':
              context.append(doc)
  
      if context:
          ctx = {'request': req}
          EmailFromTemplate('document-refusal', extra_context=ctx)\
              .send_to(req.customer.user)
  
      return HttpResponse('')
  </code></pre>
  
  <p>I've created a button which send an email under certain conditions. I'd like once I send a message to deactivate the button for five minutes and then display a pop-up message which will display the remaining time before they have the possibility to send the email again. The message may be '<em>It remains 3 minutes and 20 secondes before you may send the message again.</em>'. This message will be displayed if and only if the cursor is on the button and nothing will happen otherwise. So far when I clicked the button, it turned off, but nothing else happened. I mean django's function is never called, .... How could I fix it so that it'll do what I want? How could I display the remaining time in that message? With <code>JsonResponse()</code>?</p>
  
  <p><strong>Edit :</strong> </p>
  
  <p>I have another issue with <code>setTimeout</code>. It is easy for the client to just reload the page to skip the 5 minutes wait. By what could I substitute <code>setTimeout</code> so that it will not do such thing?</p>