Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

ENHANCEMENT Generic search form uses loadPanel() rather than being ti…

…ed to GridField (requires backend changes, see AssetAdmin), and uses jquery.form to do resets
  • Loading branch information...
commit 9f5e26d12b45c66a80b0317254809f02a3b2dbd3 1 parent 6d89994
@chillu chillu authored
Showing with 20 additions and 113 deletions.
  1. +20 −113 admin/javascript/LeftAndMain.js
View
133 admin/javascript/LeftAndMain.js
@@ -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());
- });
- },
- /**
- * Function: onsubmit
- *
- * Parameters:
- * (Event) e
- */
- onsubmit: function(e) {
- this.changeState(jQuery(this).find(':submit:first'));
- 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]);
- }
+ /**
+ * Generic search form in the CMS, often hooked up to a GridField results display.
@sminnee Owner
sminnee added a note

So, you can define the URL by the search form's action, but the panel that you're loading into seems implicit. Perhaps it would be better to have a data-targetpanel="<panel-id>" attribute on the form, rather than using this.closest('.cms-container'), which seems quite brittle?

@chillu Owner
chillu added a note

$('.cms-container') is more or less a "controller global", rather than the actual panel it loads into.
The panel defaults to ".cms-content", but can be overwritten via loadPanel(url, {selector: '.cms-edit-form'}).
That's mainly architected this way to keep the loading state reproducible in HTML5 history.
We could put a loadPanel() entwine method on all panels instead, and infer the selector from the DOM,
although I haven't had a chance to think this through ... would like Hamish's input on the whole architecture at some point anyway :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
+ */
+ $('.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: onreset
- *
- * Parameters:
- * (Event) e
- */
- onreset: function(e) {
- if(this.resetFilterForm()) {
- this.changeState(jQuery(this));
- }
+ var url = this.attr('action');
+ if(nonEmptyInputs.length) url += '?' + nonEmptyInputs.serialize();
+ this.closest('.cms-container').entwine('ss').loadPanel(url);
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
- *
+ * Resets are processed on the serverside, so need to trigger a submit.
*/
- 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;
+ onreset: function(e) {
+ this.clearForm();
+ this.submit();
}
+
});
}(jQuery));

1 comment on commit 9f5e26d

@sminnee
Owner

Great to see so much custom JS being rendered unnecessary, but I just had one comment above.

Please sign in to comment.
Something went wrong with that request. Please try again.