Author: bleny Date: 2014-04-03 11:33:46 +0200 (Thu, 03 Apr 2014) New Revision: 1815 Url: http://forge.codelutin.com/projects/wao/repository/revisions/1815 Log: implements client-side reset for filters Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/sampling-plan.jsp trunk/wao-web/src/main/webapp/wao.js Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp =================================================================== --- trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp 2014-04-03 09:12:52 UTC (rev 1814) +++ trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp 2014-04-03 09:33:46 UTC (rev 1815) @@ -44,6 +44,10 @@ WAO.get(url, {}, successCallback); }); + $('#reset-filters').click(function () { + boatsFilterController.reset(); + }); + }); </script> @@ -125,10 +129,9 @@ <div class="form-actions"> - <s:url action="boats" id="boatsUrl"/> - <s:a href="%{boatsUrl}" cssClass="btn"> - <i class="icon-reset"></i> <s:text name="wao.ui.action.reset"/> - </s:a> + <button type="button" id="reset-filters" class="btn"> + <i class="icon-reset"></i> <s:text name="wao.ui.action.reset" /> + </button> <s:submit type="button" cssClass="btn"> <i class="icon-filter"></i> <s:text name="wao.ui.action.filter"/> Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/sampling-plan.jsp =================================================================== --- trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/sampling-plan.jsp 2014-04-03 09:12:52 UTC (rev 1814) +++ trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/sampling-plan.jsp 2014-04-03 09:33:46 UTC (rev 1815) @@ -46,6 +46,10 @@ $('table.sampling-plan').toggleClass('full-view').toggleClass('compact-view'); }); + $('#reset-filters').click(function () { + sampleRowsFilterController.reset(); + }); + }); </script> @@ -140,10 +144,9 @@ <div class="form-actions"> - <s:url action="sampling-plan" id="samplingPlanUrl" /> - <s:a href="%{samplingPlanUrl}" cssClass="btn"> + <button type="button" id="reset-filters" class="btn"> <i class="icon-reset"></i> <s:text name="wao.ui.action.reset" /> - </s:a> + </button> <s:submit type="button" cssClass="btn"> <i class="icon-filter"></i> <s:text name="wao.ui.action.filter" /> Modified: trunk/wao-web/src/main/webapp/wao.js =================================================================== --- trunk/wao-web/src/main/webapp/wao.js 2014-04-03 09:12:52 UTC (rev 1814) +++ trunk/wao-web/src/main/webapp/wao.js 2014-04-03 09:33:46 UTC (rev 1815) @@ -69,13 +69,13 @@ return filter; }; + /* On va regarder les filterValues dans le modèle et ajouter toutes les options nécessaires */ this.refreshFilterValues = function() { // store options selected by user to re-select them after update var filter = this.getFilter(); var filterValues = this.model.filterValues; this.$selects.each(function (index, select) { var $select = $(select).empty(); - var name = $select.prop('name'); // FIXME brendan 26/03/14 should be data-binding but freemarker break the template :-( var binding = $select.attr('databinding'); var options = WAO.getData(binding, filterValues); @@ -83,13 +83,29 @@ var optionHtml = '<option value="' + option.value + '">' + option.label + '</option>'; $select.append(optionHtml); }); + }); + this.selectOptions(filter); + this.$filtersForm.effect('highlight', 'slow'); + }; + + /* On prend un filter en paramètre et on va sélectionner les options correspondantes */ + this.selectOptions = function (filter) { + this.$selects.each(function (index, select) { + var $select = $(select); + $select.find('option:selected').prop('selected', false); + var name = $select.prop('name'); var selectedOptions = filter[name]; $.each(selectedOptions, function (index, selectedOption) { $select.find('option[value="' + selectedOption + '"]').prop('selected', 'selected'); }); }); - this.$filtersForm.effect('highlight', 'slow'); - }; + this.$inputs.each(function (index, input) { + var $input = $(input); + var parameterName = $input.prop('name'); + var parameterValue = filter[parameterName]; + var parameterValue = $input.prop('value', parameterValue); + }); + } $(this.model).on('updated', function () { self.refreshFilterValues(); @@ -129,8 +145,14 @@ this.view.$selects.mouseleave(updateFilterValuesIfValueChanged); this.view.$inputs.mouseleave(updateFilterValuesIfValueChanged); + this.initialFilter = this.view.getFilter(); } + this.reset = function () { + this.view.selectOptions(this.initialFilter); + this.updateFilterValues(); + } + }; var Notifications = function () {