想要从 JTable 表单获取数据，但是当我尝试获取数据时，它显示未定义。
这是customStudent.js
.......
$(document).ready(function() {
$('#StudentTableContainer').jtable({
title: 'Student List',
paging: true,
pageSize: 10,
sorting: true, //Enable sorting
defaultSorting: 'name ASC',
actions: {
listAction: actionRoom,
deleteAction: 'HallManagementServlet?action=DeleteStudent',
updateAction: 'HallManagementServlet?action=UpdateStudent',
},
fields: {
reg_id: {
title: 'Registration',
key: true,
sort: true,
create: true,
edit: false
},
name: {
title: 'Name',
width: '20%',
edit: true
},
dept_id: {
title: 'Department',
edit: true,
options: 'HallManagementServlet?action=dropDownDepartment',
width: '5%'
},
session: {
title: 'session',
edit: true,
width: '7%'
},
degree_type: {
title: 'Degree type',
width: '10%',
options: {'Bachelors/Honours': 'Bachelors/Honours', 'Masters': 'Masters'},
edit: true,
list: true
},
room_number: {
title: 'Room',
width: '5%',
edit: true,
options: 'HallManagementServlet?action=dropDownRooms'
},
date_of_birth: {
title: 'Date of Birth',
type: 'date',
displayformat: 'yyyy-mm-dd',
edit: true,
list: false
},
blood_group: {
title: 'Blood Group',
width: '10%',
options: {'O-': 'O-', 'O+': 'O+', 'A-': 'A-', 'A+': 'A+', 'B-': 'B-', 'B+': 'B+', 'AB-': 'AB-', 'AB+': 'AB+'},
edit: true,
list: false
},
contact_number: {
title: 'Phone',
width: '10%',
edit: true,
list: true
},
address_line_1: {
title: 'Address line 1',
width: '13%',
edit: true,
list: false
},
address_line_2: {
title: 'Address line 6',
width: '13%',
edit: true,
list: false
},
fathers_name: {
title: 'Father\'s Name',
width: '13%',
edit: true,
list: false
},
mothers_name: {
title: 'Mother\'s Name',
width: '13%',
edit: true,
list: false
},
email: {
title: 'E-mail address',
width: '5%',
edit: true,
list: false
},
hall_id: {
title: 'Hall',
create: false,
edit: false,
list: false
},
admitted_on: {
title: 'Admitted On',
type: 'date',
displayformat: 'yyyy-mm-dd',
create: true,
edit: true,
list: true
},
payment_expires_on: {
title: 'Payment expires on',
width: '11%',
type: 'date',
displayformat: 'yyyy-mm-dd',
create: false,
edit: true,
list: true
},
paymentStatus: {
title: 'Payment Status',
width: '8%',
options: {'Paid': 'Paid', 'Due': 'Due'},
create: false,
edit: false,
list: true
},
imageFile: {
title: "Image Upload",
list: false,
create: true,
edit: false,
input: function(data) {
return '<input id="docBytes" type="file" name="docBytes" accept="image/*"><iframe name="postiframe" id="postiframe" style="display: none" />';
}
}
},
formCreated: function(event, data) {
data.form.find('input[name="reg_id"]').addClass('validate[required,[custom[number]],minSize[10],maxSize[10]');
data.form.find('input[name="name"]').addClass('validate[required,[custom[onlyLetterSp]]');
data.form.find('input[name="mothers_name"]').addClass('validate[[custom[onlyLetterSp]]');
data.form.find('input[name="fathers_name"]').addClass('validate[[custom[onlyLetterSp]]');
data.form.find('input[name="email"]').addClass('validate[custom[email]]');
data.form.validationEngine();
},
//Validate form when it is being submitted
formSubmitting: function(event, data) {
return data.form.validationEngine('validate');
},
//Dispose validation logic when form is closed
formClosed: function(event, data) {
data.form.validationEngine('hide');
data.form.validationEngine('detach');
},
recordsLoaded: function(event, data) {
$('.jtable-data-row').click(function() {
var reg_id = $(this).attr('data-record-key');
window.location.assign("viewstudent.jsp?reg_id=" + reg_id);
});
}
});
//Re-load records when user click 'load records' button.
$('#LoadRecordsButton').click(function(e) {
e.preventDefault();
$('#StudentTableContainer').jtable('load', {
name: $('#name').val(),
reg_id: $('#registration').val(),
dept_id: $('#pd_dept').val(),
session: $('#pd_session').val(),
degree_type: $('#pd_degree_type').val()
});
});
//Load all records when page is first shown
$('#LoadRecordsButton').click();
});
更准确地说，我想从这里获取更新日期:
payment_expires_on: {
title: 'Payment expires on',
width: '11%',
type: 'date',
displayformat: 'yyyy-mm-dd',
create: false,
edit: true,
list: true
},
我应该怎么做才能获得日期？获取日期后，我想计算一些内容并在 Jtable 上显示 paymentStatus。
最佳答案
updateAction: function(postData) {
var payment_date = [];
console.log("updating from custom function...");
return $.Deferred(function($dfd) {
$.ajax({
url: 'HallManagementServlet?action=UpdateStudent',
type: 'POST',
dataType: 'json',
data: postData,
success: function(data) {
$.each(data, function(entryindex, entry) {
payment_date.push(entry['payment_expires_on']);
});
alert(payment_date);
$dfd.resolve(data);
},
error: function() {
$dfd.reject();
}
});
});
}
使用此自定义 updateAction。它对我有用。
关于javascript - 在JTable中提交表单之前如何在javaScript中获取数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29036154/