I am currently working on a site with the Bootstrap theme which has a fullscreen views map (Goomap) with exposed filters. As the map is full screen I want to have the exposed filters inside a bootstrap modal. Luckily it is quite easy to theme the views exposed filters form.

To do this you have to override the views exposed filters form theme file. Copy the views theme file (sites/all/modules/views/theme/views-exposed-form.tpl.php) and place the copy in your own theme folder. To get this to work you may have to click on "Rescan template files" under "theme" in the view. Your site should now be using the new template file and you can edit it as you please. You can get more specific with the naming of the template file to target a single exposed form, (views-exposed-form--VIEWNAME.tpl.php for example).

Below is the code that I am using in my views-exposed-form.tpl.php

<a data-toggle="tooltip" title="<?php print t('Filter Results'); ?>">
<button class="btn btn-default btn-sm" data-toggle="modal" data-target="#filterModal">
  <i class="glyphicon glyphicon-cog"></i>
  Filter
</button>
</a>

<div class="views-exposed-form">
  <div class="modal fade" id="filterModal" tabindex="-1" role="dialog" aria-labelledby="filterLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          <h4 class="modal-title" id="filterLabel">Filter</h4>
        </div>
        <div class="modal-body">

  <div class="views-exposed-widgets clearfix">
    <?php foreach ($widgets as $id => $widget): ?>
      <div id="<?php print $widget->id; ?>-wrapper" class="views-exposed-widget views-widget-<?php print $id; ?>">
        <?php if (!empty($widget->label)): ?>
          <label for="<?php print $widget->id; ?>">
            <?php print $widget->label; ?>
          </label>
        <?php endif; ?>
        <?php if (!empty($widget->operator)): ?>
          <div class="views-operator">
            <?php print $widget->operator; ?>
          </div>
        <?php endif; ?>
        <div class="views-widget">
          <?php print $widget->widget; ?>
        </div>
        <?php if (!empty($widget->description)): ?>
          <div class="description">
            <?php print $widget->description; ?>
          </div>
        <?php endif; ?>
      </div>
    <?php endforeach; ?>
    <?php if (!empty($sort_by)): ?>
      <div class="views-exposed-widget views-widget-sort-by">
        <?php print $sort_by; ?>
      </div>
      <div class="views-exposed-widget views-widget-sort-order">
        <?php print $sort_order; ?>
      </div>
    <?php endif; ?>
    <?php if (!empty($items_per_page)): ?>
      <div class="views-exposed-widget views-widget-per-page">
        <?php print $items_per_page; ?>
      </div>
    <?php endif; ?>
    <?php if (!empty($offset)): ?>
      <div class="views-exposed-widget views-widget-offset">
        <?php print $offset; ?>
      </div>
    <?php endif; ?>


  </div>

        </div>
        <div class="modal-footer">
          <?php print $button; ?>
          <?php if (!empty($reset_button)): ?>
              <?php print $reset_button; ?>
          <?php endif; ?>
        </div>
      </div>
    </div>
  </div>
</div>