ENHANCEMENT Generic search form uses loadPanel() rather than being tied to GridField (requires backend changes, see AssetAdmin), and uses jquery.form to do resets

This commit is contained in:
Ingo Schommer 2012-03-02 15:20:17 +01:00
parent 6d899940a3
commit 9f5e26d12b

View File

@ -390,128 +390,35 @@ jQuery.noConflict();
$('.cms-container').entwine('ss').loadPanel(url);
}
});
$('.cms-filter-form').entwine({
GridField: null,
/**
* Function onmatch
*
* Try to find the related gridfield by looking up the data-gridfield attribute on this
* filter form
*/
onmatch: function() {
var gridfieldName = this.attr('data-gridfield');
this.setGridField($('.grid[data-name='+gridfieldName+']'));
var self = this;
this.getGridField().bind('reload', function(e, gridfield){
self.setFilterValues($(gridfield).getState());
/**
* Generic search form in the CMS, often hooked up to a GridField results display.
*/
$('.cms-search-form').entwine({
onsubmit: function() {
// Remove empty elements and make the URL prettier
var nonEmptyInputs = this.find(':input:not(:submit)').filter(function() {
// Use fieldValue() from jQuery.form plugin rather than jQuery.val(),
// as it handles checkbox values more consistently
var vals = $.grep($(this).fieldValue(), function(val) { return (val);});
return (vals.length);
});
},
/**
* Function: onsubmit
*
* Parameters:
* (Event) e
*/
onsubmit: function(e) {
this.changeState(jQuery(this).find(':submit:first'));
var url = this.attr('action');
if(nonEmptyInputs.length) url += '?' + nonEmptyInputs.serialize();
this.closest('.cms-container').entwine('ss').loadPanel(url);
return false;
},
/**
* Function: setFilterValues
*
* Parameters:
* (JSON) state
*
*/
setFilterValues: function(state){
var filterValues = state.GridFieldFilter.Columns;
if(jQuery.isEmptyObject(filterValues)){
this.resetFilterForm();
return;
}
this.filterFields().each(function(idx, element) {
if(typeof filterValues[element.name] !== "undefined") {
$(element).val(filterValues[element.name]);
}
});
},
/**
* Function: onreset
*
* Parameters:
* (Event) e
* Resets are processed on the serverside, so need to trigger a submit.
*/
onreset: function(e) {
if(this.resetFilterForm()) {
this.changeState(jQuery(this));
}
return false;
},
/**
* Function resetFilterForm
*
**/
resetFilterForm: function() {
var needUpdate = false;
this.filterFields().each(function(idx, element) {
if($(element).val()) {
needUpdate = true;
$(element).val('');
}
if($(element).hasClass('chzn-done')){
$(element).trigger("liszt:updated");
}
});
return needUpdate;
},
/**
* Function: changeState
*
* Change the state of the gridfield, reloads it's and set loading classes on elements
*
* Parameters:
* (Element) element - the element that will get a loading class added / removed
*
*/
changeState: function(element) {
element.addClass('loading');
this.getGridField().setState('GridFieldFilter', {'Columns': this.filterValues()});
this.getGridField().reload(null, function(){
element.removeClass('loading');
});
},
/**
* Function filterFields
* Get all fields that contains filter values
*
*/
filterFields: function() {
return this.find(':input').not(".action, .hidden");
},
/**
* Function: filterValues
*
* Returns an key-value array for the filter values set in the filter form
*
*/
filterValues: function() {
var filterColumns = {};
this.filterFields().each(function(idx,elm){
filterColumns[$(elm).attr('name')] = $(elm).val();
});
return filterColumns;
this.clearForm();
this.submit();
}
});
}(jQuery));