I am trying to create a page that displays a bunch of resources with a filter to allow the end-user to sort the resources by type. I am using the following versions:
- Drupal 7.28
- Views 7.x-3.8
- Semantic Views 7.x-1.0-alpha1
- Bootstrap 3
VIEWS SETTING:
- Format: Semantic Views
- Show: Semantic Views: Fields
- Filter Criteria: Content: Resource Type (exposed)
- Exposed form in block: Yes
- Exposed form style: Basic
- Use AJAX: Yes
The functionality works and the results are displayed based on what's selected in the resource type drop-down filter. However, the results are displaying in nested divs each time the form gets submitted and I can't figure out why. :(
SOURCE CODE BEFORE SUBMISSION
<div class="region region-content">
<section id="block-system-main" class="block block-system clearfix">
<div class="resources-container container-fluid">
<div class="container">
<div class="view-dom-id-a9b31cdd0f34c14b5d87837cb4d072cc jquery-once-1-processed">
<div class="row resources-Wrapper">
[script for the $rows]
SOURCE CODE AFTER 1st SUBMISSION
<div class="region region-content">
<section id="block-system-main" class="block block-system clearfix">
<div class="resources-container container-fluid">
<div class="container">
<div>
<div class="resources-container container-fluid">
<div class="container">
<div class="view-dom-id-65d9abf32d69cd0ef0cf53a48be512f6 jquery-once-1-processed">
<div class="row resources-Wrapper">
[script for the $rows]
SOURCE CODE AFTER 2nd SUBMISSION
<div class="region region-content">
<section id="block-system-main" class="block block-system clearfix">
<div class="resources-container container-fluid">
<div class="container">
<div>
<div class="resources-container container-fluid">
<div class="container">
<div>
<div class="resources-container container-fluid">
<div class="container">
<div class="view-dom-id-5ce84e5f739ed6ab5c8f11ade31e3e96 jquery-once-1-processed">
<div class="row resources-Wrapper">
[script for the $rows]
To theme the exposed filter as a block, I did the following: copied the ‘views-exposed-form.tpl.php’ file in sites/all/modules/views/theme and pasted it in my theme directory and renamed accordingly (views-exposed-form--[view name].tpl.php). I did not edit the script in the template. (My reference: http://timonweb.com/how-display-views-exposed-filter-block-and-theme-it)
Then in my views-view--[view name].tpl.php, I added the following script:
<?php if ($rows): ?>
<div class="resources-container container-fluid">
<div class="container">
<div class="view-dom-id-<?php print $dom_id; ?>">
<div class="row resources-Wrapper">
<?php print $rows; ?>
</div>
</div>
</div>
</div>
<?php elseif ($empty): ?>
<div class="view-empty">
<?php print $empty; ?>
</div>
<?php endif; ?>
I don't really understand what view-dom-id- does even after reading a bunch of articles...but I added in as a div after reading the following post: https://www.drupal.org/node/690748. If I don't have it in the views template, then the filter doesn't work.
DEFAULT SCRIPT IN views-exposed-form--[view name].tpl.php
<?php if (!empty($q)): ?>
<?php
// This ensures that, if clean URLs are off, the 'q' is added first so that
// it shows up first in the URL.
print $q;
?>
<?php endif; ?>
<div class="views-exposed-form">
<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 class="views-exposed-widget views-submit-button">
<?php print $button; ?>
</div>
<?php if (!empty($reset_button)): ?>
<div class="views-exposed-widget views-reset-button">
<?php print $reset_button; ?>
</div>
<?php endif; ?>
</div>
</div>
I've spent 2 days trying to debug, so any guidance would be greatly appreciated!!
Thank you for taking the time to read
