tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-10-22 14:05:37 +02:00
Code Issues Projects Releases Wiki Activity

ENHANCEMENT Making TreeDropdownField and TreeMultiSelectField serverside markup more unobtrusive, adding DOM elements required by javascript through TreeDropdownField.js

Browse Source
This commit is contained in:
Ingo Schommer 2011-03-08 08:29:09 +13:00
parent e7ad682cf2
commit f06480da55
3 changed files with 60 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
forms/TreeDropdownField.php
View File

@ -134,8 +134,9 @@ class TreeDropdownField extends FormField {
'div',
array (
'id' => "TreeDropdownField_{$this->id()}",
'class' => 'TreeDropdownField single' . ($this->extraClass() ? " {$this->extraClass()}" : ''),
'class' => 'TreeDropdownField single' . ($this->extraClass() ? " {$this->extraClass()}" : '') . ($this->showSearch ? " searchable" : ''),
'href' => $this->form ? $this->Link('tree') : "",
'data-title' => $title,
),
$this->createTag (
'input',
@ -145,29 +146,6 @@ class TreeDropdownField extends FormField {
'name' => $this->name,
'value' => $this->value
)
) . ($this->showSearch ?
$this->createTag(
'input',
array(
'class' => 'title',
'value' => '(Choose or type search)'
)
) :
$this->createTag (
'span',
array (
'class' => 'items'
),
$title
)
) . $this->createTag (
'a',
array (
'href' => '#',
'title' => 'open',
'class' => 'editLink'
),
' '
)
);
}
@ -192,7 +170,7 @@ class TreeDropdownField extends FormField {
// Regular source specification
$isSubTree = false;
$this->search = Convert::Raw2SQL($request->getVar('search'));
$this->search = Convert::Raw2SQL($request->requestVar('search'));
$ID = (is_numeric($request->latestparam('ID'))) ? (int)$request->latestparam('ID') : (int)$request->requestVar('ID');
if($ID) {

52
forms/TreeMultiselectField.php
View File

@ -79,22 +79,19 @@ class TreeMultiselectField extends TreeDropdownField {
* formfield can contain multiple values.
*/
function Field() {
Requirements::add_i18n_javascript(SAPPHIRE_DIR . '/javascript/lang');
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery/jquery.js');
Requirements::javascript(SAPPHIRE_DIR . '/javascript/jquery_improvements.js');
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-entwine/dist/jquery.entwine-dist.js');
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jstree/jquery.jstree.js');
Requirements::javascript(SAPPHIRE_DIR . '/javascript/TreeDropdownField.js');
Requirements::css(SAPPHIRE_DIR . '/thirdparty/jquery-ui-themes/smoothness/jquery.ui.all.css');
Requirements::css(SAPPHIRE_DIR . '/css/TreeDropdownField.css');
$value = '';
$itemList = '';
Requirements::add_i18n_javascript(SAPPHIRE_DIR . '/javascript/lang');
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/prototype/prototype.js');
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/behaviour/behaviour.js');
Requirements::javascript(SAPPHIRE_DIR . '/javascript/tree/tree.js');
// needed for errorMessage()
Requirements::javascript(SAPPHIRE_DIR . '/javascript/LeftAndMain.js');
Requirements::javascript(SAPPHIRE_DIR . '/javascript/TreeSelectorField.js');
Requirements::css(SAPPHIRE_DIR . '/javascript/tree/tree.css');
Requirements::css(SAPPHIRE_DIR . '/css/TreeDropdownField.css');
$items = $this->getItems();
if($items && count($items)) {
@ -104,16 +101,31 @@ class TreeMultiselectField extends TreeDropdownField {
}
if(isset($titleArray)) {
$itemList = implode(", ", $titleArray);
$title = implode(", ", $titleArray);
$value = implode(",", $idArray);
}
} else {
$title = _t('DropdownField.CHOOSE', '(Choose)', PR_MEDIUM, 'start value of a dropdown');
}
$id = $this->id();
return <<<HTML
<div class="TreeDropdownField multiple" href="{$this->Link()}"><input id="$id" type="hidden" name="$this->name" value="$value" /><span class="items">$itemList</span><a href="#" title="open" class="editLink">&nbsp;</a></div>
HTML;
return $this->createTag (
'div',
array (
'id' => "TreeDropdownField_{$this->id()}",
'class' => 'TreeDropdownField multiple' . ($this->extraClass() ? " {$this->extraClass()}" : '') . ($this->showSearch ? " searchable" : ''),
'href' => $this->form ? $this->Link('tree') : "",
'data-title' => $title,
),
$this->createTag (
'input',
array (
'id' => $this->id(),
'type' => 'hidden',
'name' => $this->name,
'value' => $value
)
)
);
}
/**

31
javascript/TreeDropdownField.js
View File

@ -1,22 +1,41 @@
(function($) {
$.entwine('ss', function($){
var strings = {
'openlink': 'Open',
'searchFieldTitle': '(choose or search)'
};
/**
* @todo Locale support
* @todo Multiselect
* @todo Search
* @todo Locale support/form serialization
* @todo Multiselect: Select items after tree load, serialize titles, override title on select but keep panel open
* @todo Error display
* @todo No results display for search
* @todo Automatic expansion of ajax children when multiselect is triggered
* @todo Automatic panel positioning based on available space (top/bottom)
* @todo forceValue
* @todo Automatic width
* @todo Expand title height to fit all elements
*/
$('.TreeDropdownField').entwine({
onmatch: function() {
this.append('<div class="panel"><div class="tree-holder"></div></div>');
this.append(
'<span class="title"></span>' +
'<a href="#" title="' + strings.openLink + '" class="toggle-panel-link"></a>' +
'<div class="panel"><div class="tree-holder"></div></div>'
);
if(this.data('title')) this.setTitle(this.data('title'));
this.getPanel().hide();
this._super();
},
getPanel: function() {
return this.find('.panel');
},
openPanel: function() {
var panel = this.getPanel();
var panel = this.getPanel(), tree = this.find('.tree-holder');
panel.show();
if(!panel.find('li').length) this.loadTree();
if(tree.is(':empty')) this.loadTree();
},
closePanel: function() {
this.getPanel().hide();