title: Bootstrap dropdown menu with WTF and Flask
body: <p>I'm an amateur building a Flask/WTF/Jinja2 (using the Bootstrap) website, and I have not yet implemented a dropdown button.  Unfortunately, I'm really struggling with the Bootstrap / Jinja2 elements (i can get my data to the jinja2, but can't get anything to render properly).  If it helps as a reference, I'm emerging from the Corey Schafer school of Flask on Youtube.</p>
  <p>Here is my WTF class statement:</p>
  <pre><code>class SegmentForm(FlaskForm):
       segmentID = SelectField(label='Choose a Segment', coerce=int, validators=[InputRequired])
  </code></pre>
  <p>Here is my route (Flask) statement:</p>
  <pre><code>@decks.route('/decks/segments', methods=['GET'])
  @login_required
  def segments():
      form = SegmentForm()
      pathname = os.path.abspath(os.path.dirname(__file__))
  
      df = pd.read_csv(pathname + '/upload_data/segment_summary.csv', index_col=None)
      form.segmentID.choices = df.seg_name
  </code></pre>
  <p>Where I am struggling is to get the Bootstrap / Jinja2 sorted out:</p>
  <pre><code>    &lt;div class=&quot;dropdown&quot;&gt;
          &lt;button class=&quot;btn btn-primary dropdown-toggle&quot; type=&quot;button&quot; id={{form.segmentID.label}}&gt;
              {{ form.segmentID.label }}
          &lt;/button&gt;
          &lt;div class=&quot;dropdown-menu&quot; aria-labelledby={{form.segmentID.label}}&gt;
                  {% for segment in form.segmentID.choices %}
                    &lt;option value=&quot;{{ segment }}&quot;&gt;{{ segment }}&lt;/option&gt;
                  {% endfor %}
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>