Я использую jtable http://jtable.org/ в своем проекте. jTable — это плагин jQuery, который используется для создания таблиц CRUD на основе AJAX без кодирования HTML или Javascript.
http://i62.tinypic.com/3461eo3.jpg
код jtable для вышеуказанной формы
HTML-код:
<div id="StudentTableContainer"></div>
Код JavaScript:
<script type="text/javascript">
$(document).ready(function () {
$('#StudentTableContainer').jtable({
title: 'Student List',
paging: true,
pageSize: 10,
sorting: true,
defaultSorting: 'Name ASC',
actions: {
listAction: '/Demo/StudentList',
deleteAction: '/Demo/DeleteStudent',
updateAction: '/Demo/UpdateStudent',
createAction: '/Demo/CreateStudent'
},
fields: {
StudentId: {
key: true,
create: false,
edit: false,
list: false
},
Name: {
title: 'Name',
width: '30%'
},
EmailAddress: {
title: 'Email address',
list: false
},
Password: {
title: 'User Password',
type: 'password',
list: false
},
Gender: {
title: 'Gender',
options: { 'M': 'Male', 'F': 'Female' },
list: false
},
ContinentalId: {
title: 'Continental',
options: '/Demo/GetContinentalOptions',
list: false
},
CountryId: {
title: 'Country',
dependsOn: 'ContinentalId', //Countries depends on continentals. Thus, jTable builds cascade dropdowns!
options: function (data) {
if (data.source == 'list') {
//Return url of all countries for optimization.
//This method is called for each row on the table and jTable caches options based on this url.
return '/Demo/GetCountryOptions?continentalId=0';
}
//This code runs when user opens edit/create form or changes continental combobox on an edit/create form.
//data.source == 'edit' || data.source == 'create'
return '/Demo/GetCountryOptions?continentalId=' + data.dependedValues.ContinentalId;
},
list: false
},
CityId: {
title: 'City',
width: '30%',
dependsOn: 'CountryId', //Cities depends on countries. Thus, jTable builds cascade dropdowns!
options: function (data) {
if (data.source == 'list') {
//Return url of all cities for optimization.
//This method is called for each row on the table and jTable caches options based on this url.
return '/Demo/GetCityOptions?countryId=0';
}
//This code runs when user opens edit/create form or changes country combobox on an edit/create form.
//data.source == 'edit' || data.source == 'create'
return '/Demo/GetCityOptions?countryId=' + data.dependedValues.CountryId;
}
},
BirthDate: {
title: 'Birth date',
type: 'date',
displayFormat: 'yy-mm-dd',
list: false
},
Education: {
title: 'Education',
list: false,
type: 'radiobutton',
options: [
{ Value: '1', DisplayText: 'Primary school' },
{ Value: '2', DisplayText: 'High school' },
{ Value: '3', DisplayText: 'University' }
]
},
About: {
title: 'About this person',
type: 'textarea',
list: false
},
IsActive: {
title: 'Status',
width: '15%',
type: 'checkbox',
values: { 'false': 'Passive', 'true': 'Active' },
defaultValue: 'true'
},
RecordDate: {
title: 'Record date',
width: '25%',
type: 'date',
displayFormat: 'yy-mm-dd',
create: false,
edit: false,
sorting: false //This column is not sortable!
}
}
});
//Load student list from server
$('#StudentTableContainer').jtable('load');
});
</script>
Я хочу иметь раскрывающийся список в моем проекте, который должен принимать значения из базы данных через класс действий struts2. Как и в приведенном выше демонстрационном коде, доступ к списку континентов можно получить из базы данных через класс действий struts2 (используя шаблон URL /Demo/GetContinentalOptions
Поскольку jtable понимает только json, пожалуйста, объясните мне, что я должен написать в классе действий Struts2 и Struts.xml.
Примечание. В вашем примере кода вы можете даже жестко закодировать раскрывающиеся значения.
