Additional input-group-addon

[asaglimbeni]

Additional input-group-addon

[ollytheninja]

Hi James,
First, that looks great and I think many people would find it useful.
At the moment the original, non django specific version supports linking pickers https://eonasdan.github.io/bootstrap-datetimepicker/#linked-pickers but AFAIK it's not easy to do with this module.
I would love to see the implementation, could you create PR?

[ollytheninja]

I've been playing with this today with no luck, any chance you can publish your code?

[munnerz]

This is my code in use. This was merged in #60?

class ClipForm(forms.Form):
    start_datetime = forms.DateTimeField(widget=DateTimeWidget(usel10n=True, bootstrap_version=3, attrs={'label': "Start", "readonly": ''}))
    end_datetime = forms.DateTimeField(widget=DateTimeWidget(usel10n=True, bootstrap_version=3, attrs={'label': "End", "readonly": ''}))
    camera_name = forms.Field()

[munnerz]

Ah, or are you asking for the code used to make two boxes appear side by side like that?

This is as follows (taken straight from the project displayed above.. excuse the irrelevant parts)

  <div class="col-xs-12 col-sm-offset-1 col-sm-10">

    <div class="row">
      <form id="clip-form" action="{% url 'watch' %}" method="POST">
        {% csrf_token %}
        <div class="col-xs-12 col-sm-5">
          {{ search_form.start_datetime }}
        </div>

        <div class="col-xs-12 col-sm-5">
          {{ search_form.end_datetime }}
        </div>

        <input type="hidden" id="id_camera_name" name="camera_name" />

        <div class="col-xs-12 col-sm-2">
          <div class="btn-group pull-right">
            <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
              Watch <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" role="menu">
{% for c in cameras %}      
              <li onclick="$('#id_camera_name').val('{{ c }}'); $('#clip-form').submit()">
                <a href="#">{{ c }}</a>
              </li>
{% endfor %}
            </ul>
          </div>
        </div>

      </form>
    </div>
  </div>