mirror of
https://github.com/silverstripe/silverstripe-cms
synced 2024-10-22 08:05:56 +02:00
ENHANCEMENT Added filter/search capability to AssetTableField, this is similar to MemberTableField, except you search by file name.
ENHANCEMENT Refactored CSS applied to filter boxes by using common selector git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/trunk@65173 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
Sean Harvey
parent
9bf3245939
commit
bd10591e7c
@ -76,6 +76,7 @@ class AssetAdmin extends LeftAndMain {
|
||||
|
||||
// needed for MemberTableField (Requirements not determined before Ajax-Call)
|
||||
Requirements::javascript(SAPPHIRE_DIR . "/javascript/ComplexTableField.js");
|
||||
Requirements::javascript(CMS_DIR . '/javascript/AssetTableField.js');
|
||||
Requirements::css(THIRDPARTY_DIR . "/greybox/greybox.css");
|
||||
Requirements::css(SAPPHIRE_DIR . "/css/ComplexTableField.css");
|
||||
|
||||
|
||||
@ -19,9 +19,22 @@ class AssetTableField extends ComplexTableField {
|
||||
function __construct($controller, $name, $sourceClass, $fieldList, $detailFormFields, $sourceFilter = "", $sourceSort = "", $sourceJoin = "") {
|
||||
parent::__construct($controller, $name, $sourceClass, $fieldList, $detailFormFields, $sourceFilter, $sourceSort, $sourceJoin);
|
||||
|
||||
$this->sourceSort = "Title";
|
||||
Requirements::javascript(CMS_DIR . '/javascript/AssetTableField.js');
|
||||
|
||||
$SNG_file = singleton('File');
|
||||
|
||||
// If search was request, filter the results here
|
||||
$SQL_search = (!empty($_REQUEST['FileSearch'])) ? Convert::raw2sql($_REQUEST['FileSearch']) : null;
|
||||
if($SQL_search) {
|
||||
$searchFilters = array();
|
||||
foreach($SNG_file->searchableFields() as $fieldName => $fieldSpec) {
|
||||
if(strpos($fieldName, '.') === false) $searchFilters[] = "`$fieldName` LIKE '%{$SQL_search}%'";
|
||||
}
|
||||
$this->sourceFilter = '(' . implode(' OR ', $searchFilters) . ')';
|
||||
}
|
||||
|
||||
$this->sourceSort = 'Title';
|
||||
$this->Markable = true;
|
||||
|
||||
}
|
||||
|
||||
function setFolder($folder) {
|
||||
@ -142,6 +155,34 @@ class AssetTableField extends ComplexTableField {
|
||||
|
||||
return $detailFormFields;
|
||||
}
|
||||
|
||||
/**
|
||||
* Provide some HTML for a search form, to be
|
||||
* added above the AssetTable field, allowing
|
||||
* a user to filter the current table's files
|
||||
* by their filename.
|
||||
*
|
||||
* @return string HTML for search form
|
||||
*/
|
||||
function SearchForm() {
|
||||
$searchFields = new FieldGroup(
|
||||
new TextField('FileSearch', _t('MemberTableField.SEARCH', 'Search')),
|
||||
new HiddenField("ctf[ID]", '', $this->ID),
|
||||
new HiddenField('FileFieldName', '', $this->name)
|
||||
);
|
||||
|
||||
$actionFields = new LiteralField(
|
||||
'FileFilterButton',
|
||||
'<input type="submit" class="action" name="FileFilterButton" value="' . _t('MemberTableField.FILTER', 'Filter') . '" id="FileFilterButton"/>'
|
||||
);
|
||||
|
||||
$fieldContainer = new FieldGroup(
|
||||
$searchFields,
|
||||
$actionFields
|
||||
);
|
||||
|
||||
return $fieldContainer->FieldHolder();
|
||||
}
|
||||
|
||||
}
|
||||
?>
|
||||
|
||||
@ -374,24 +374,20 @@
|
||||
/**
|
||||
* TableField Subclasses
|
||||
*/
|
||||
div.MemberListFilter,
|
||||
div.MemberFilter,
|
||||
div.CommentFilter {
|
||||
width: 37em;
|
||||
|
||||
/* Filter box (for search/filter box above a table on Asset/MemberTableField) */
|
||||
div.filterBox {
|
||||
width: 33em;
|
||||
margin: 5px 0;
|
||||
padding: 5px;
|
||||
background: #ebeadb;
|
||||
border: 1px solid #aca899;
|
||||
}
|
||||
div.MemberListFilter .middleColumn,
|
||||
div.MemberFilter .middleColumn,
|
||||
div.CommentFilter .middleColumn {
|
||||
display: inline !important;
|
||||
div.filterBox .middleColumn {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.right form div.MemberListFilter label,
|
||||
.right form div.MemberFilter label,
|
||||
.right form div.CommentFilter label {
|
||||
.right form div.filterBox label {
|
||||
display: block;
|
||||
width: 5em;
|
||||
float: left;
|
||||
@ -401,20 +397,15 @@ div.CommentFilter {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
div.MemberListFilter div.field,
|
||||
div.MemberFilter div.field,
|
||||
div.CommentFilter div.field {
|
||||
div.filterBox div.field {
|
||||
margin-left: 0 !important;
|
||||
padding: 0;
|
||||
font-size: 12px;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
div.MemberListFilter input,
|
||||
div.MemberListFilter select,
|
||||
div.MemberFilter input,
|
||||
div.MemberFilter select,
|
||||
div.CommentFilter input,
|
||||
div.CommentFilter select {
|
||||
div.filterBox input,
|
||||
div.filterBox select {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
||||
102
javascript/AssetTableField.js
Normal file
102
javascript/AssetTableField.js
Normal file
@ -0,0 +1,102 @@
|
||||
AssetTableField = Class.create();
|
||||
AssetTableField.applyTo('#Form_EditForm_Files');
|
||||
AssetTableField.prototype = {
|
||||
|
||||
initialize: function() {
|
||||
Behaviour.register({
|
||||
'#Form_EditForm div.FileFilter input' : {
|
||||
onkeypress : this.prepareSearch.bind(this)
|
||||
},
|
||||
|
||||
'#Form_EditForm' : {
|
||||
changeDetection_fieldsToIgnore : {
|
||||
'ctf[start]' : true,
|
||||
'ctf[ID]' : true,
|
||||
'FileFilterButton' : true,
|
||||
'FileFieldName' : true,
|
||||
'FileSearch' : true
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// prevent submission of wrong form-button (FileFilterButton)
|
||||
prepareSearch: function(e) {
|
||||
// IE6 doesnt send an event-object with onkeypress
|
||||
var event = (e) ? e : window.event;
|
||||
var keyCode = (event.keyCode) ? event.keyCode : event.which;
|
||||
|
||||
if(keyCode == Event.KEY_RETURN) {
|
||||
var el = Event.element(event);
|
||||
$('FileFilterButton').onclick(event);
|
||||
Event.stop(event);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FileFilterButton = Class.create();
|
||||
FileFilterButton.applyTo('#FileFilterButton');
|
||||
FileFilterButton.prototype = {
|
||||
initialize: function() {
|
||||
this.inputFields = new Array();
|
||||
|
||||
var childNodes = this.parentNode.parentNode.getElementsByTagName('input');
|
||||
|
||||
for( var index = 0; index < childNodes.length; index++ ) {
|
||||
if( childNodes[index].tagName ) {
|
||||
childNodes[index].resetChanged = function() { return false; }
|
||||
childNodes[index].isChanged = function() { return false; }
|
||||
this.inputFields.push( childNodes[index] );
|
||||
}
|
||||
}
|
||||
|
||||
childNodes = this.parentNode.getElementsByTagName('select');
|
||||
|
||||
for( var index = 0; index < childNodes.length; index++ ) {
|
||||
if( childNodes[index].tagName ) {
|
||||
childNodes[index].resetChanged = function() { return false; }
|
||||
childNodes[index].field_changed = function() { return false; }
|
||||
this.inputFields.push( childNodes[index] );
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
isChanged: function() {
|
||||
return false;
|
||||
},
|
||||
|
||||
onclick: function(e) {
|
||||
if(!$('ctf-ID') || !$('FileFieldName')) {
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
var form = Event.findElement(e, 'form');
|
||||
var fieldName = $('FileFieldName').value;
|
||||
var fieldID = form.id + '_' + fieldName;
|
||||
|
||||
var updateURL = form.action + '/field/' + fieldName + '?ajax=1';
|
||||
for(var index = 0; index < this.inputFields.length; index++) {
|
||||
if(this.inputFields[index].tagName) {
|
||||
updateURL += '&' + this.inputFields[index].name + '=' + encodeURIComponent(this.inputFields[index].value);
|
||||
}
|
||||
}
|
||||
|
||||
updateURL += ($('SecurityID') ? '&SecurityID=' + $('SecurityID').value : '');
|
||||
|
||||
new Ajax.Updater(fieldID, updateURL, {
|
||||
onComplete: function() {
|
||||
Behaviour.apply($(fieldID), true);
|
||||
},
|
||||
onFailure: function(response) {
|
||||
errorMessage('Could not filter results: ' + response.responseText );
|
||||
}
|
||||
});
|
||||
} catch(er) {
|
||||
errorMessage('Error searching');
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,7 @@
|
||||
<div id="$id" class="$CSSClasses field">
|
||||
<div class="FileFilter filterBox">
|
||||
$SearchForm
|
||||
</div>
|
||||
<% include TableListField_PageControls %>
|
||||
<table class="data">
|
||||
<thead>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<div id="$id" class="$CSSClasses">
|
||||
<div class="CommentFilter">
|
||||
<div class="CommentFilter filterBox">
|
||||
$SearchForm
|
||||
</div>
|
||||
<% include TableListField_PageControls %>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<div id="$id" class="$CSSClasses">
|
||||
<div class="MemberFilter">
|
||||
<div class="MemberFilter filterBox">
|
||||
$SearchForm
|
||||
</div>
|
||||
<div id="MemberList">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user