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

ENHANCEMENT Allow submitting form data alongside TreeDropdownField ajax request, which can be used to retain state

Browse Source
This commit is contained in:
Ingo Schommer 2011-03-10 15:04:29 +13:00
parent 99099e8838
commit 35100c3e11
2 changed files with 50 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
javascript/TreeDropdownField.js
View File

@ -7,8 +7,6 @@
};
/**
* @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
@ -58,7 +56,7 @@
},
loadTree: function(params, callback) {
var self = this, panel = this.getPanel(), treeHolder = $(panel).find('.tree-holder');
var params = params || {};
var params = (params) ? this.getRequestParams().concat(params) : this.getRequestParams();
panel.addClass('loading');
treeHolder.load(this.attr('href'), params, function(html, status, xhr) {
var firstLoad = true;
@ -84,6 +82,7 @@
});
},
getTreeConfig: function() {
var self = this;
return {
'core': {
'initially_open': ['record-0'],
@ -95,7 +94,9 @@
'ajax': {
'url': this.attr('href'),
'data': function(node) {
return { ID : $(node).data("id") ? $(node).data("id") : 0 , ajax: 1};
var id = $(node).data("id") ? $(node).data("id") : 0, params = self.getRequestParams();
params = params.concat([{name: 'ID', value: id}, {name: 'ajax', value: 1}]);
return params;
}
}
},
@ -108,6 +109,16 @@
},
'plugins': ['html_data', 'ui', 'themes']
};
},
/**
* If the field is contained in a form, submit all form parameters by default.
* This is useful to keep state like locale values which are typically
* encoded in hidden fields through the form.
*
* @return {array}
*/
getRequestParams: function() {
return [];
}
});
$('.TreeDropdownField *').entwine({
@ -173,7 +184,7 @@
},
loadTree: function(params, callback) {
var self = this, panel = this.getPanel(), treeHolder = $(panel).find('.tree-holder');
var params = params || {};
var params = (params) ? this.getRequestParams().concat(params) : this.getRequestParams();
panel.addClass('loading');
treeHolder.load(this.attr('href'), params, function(html, status, xhr) {
var firstLoad = true;

35
tests/javascript/TreeDropDownField/TreeDropdownField.js
View File

@ -190,7 +190,7 @@
it('it sets the selected titles', function() {
var f = $('#testfield'), panel = f.entwine('ss').getPanel();
loadTree(f);
var xhr = loadTree(f);
// TODO loaded.jstree event works with timeouts, so we have to wait before inspection
waits(200);
@ -201,6 +201,39 @@
});
});
});
describe('when field is contained in a form', function() {
beforeEach(function() {
$('#myform .TreeDropdownField').entwine('ss', {
getRequestParams: function() {
return this.parents('form:first').serializeArray();
}
});
// load fixture
$('body').append(
'<form id="myform" url="/myform">' +
'<div id="testfield" class="TreeDropdownField" href="/myurl" data-title="Selected">' +
'<input type="hidden" name="testfield" value="1" />' +
'</div>' +
'<input type="hidden" name="MyFormValue" value="foo" />' +
'</form>'
);
});
afterEach(function() {
$('#testfield').remove();
});
it('sends all form values with ajax requests', function() {
var f = $('#testfield'), panel = f.entwine('ss').getPanel();
loadTree(f);
var xhr = mostRecentAjaxRequest();
expect(xhr.params).toContain('MyFormValue=foo');
});
});
});
}(jQuery));