效果图:
这是后台数据库根据findById方法查询出的结果 转换成json在前台所见。
java:
public String findEquipmentInfo_jp() {
Page page =new Page();
page.setLimit(this.getLimit());
page.setStart(this.getStart());
if (equipmentInfo != null && !"".equals(equipmentInfo)){
String id = equipmentInfo.getId();
if (id != null && !"".equals(id)) {
EquipmentInfo list = service.findById(id);
JSONArray jsonObject=JSONArray.fromObject(list);//JSONObject也可以,如效果图,JSONArray在最外城有中空号
this.setJsonStr(jsonObject.toString());
return SUCCESS;
}
}
List<EquipmentInfo> list=service.findEquipmentInfo(equipmentInfo,page);
// ServletActionContext.getRequest().setAttribute("list", list);
this.setJsonStr(listToJoson(list));
return SUCCESS;
}
js
function showdetails(id) {
var rowData = $("#grid-table").jqGrid('getRowData',id);
$.post('findEquipmentInfo_jp.action', {'equipmentInfo.id':id}, function(data, textStatus, xhr) {
/*optional stuff to do after success */
if (textStatus == "success") {
var rowData = JSON.parse(data);
// $.each(JSON.parse(rowData), function(idx, rowData) {//这边是数据不止一条的json遍历
$("#details_id").val(rowData[0].companyId);
$("#company_id_details").val(rowData[0].companyId);
$("#company_name_details").val(rowData[0].companyName);
$("#computer_room_details").val(rowData[0].machineRoom);
$("#cabinet_details").val(rowData[0].equipmentCabinet);
$("#equipment_type_details").val(rowData[0].deviceType);
$("#equipment_name_details").val(rowData[0].deviceName);
$("#equipment_ip_details").val(rowData[0].deviceIP);
$("#details_ip").val(rowData[0].deviceIP);
$("#equipment_brand_details").val(rowData[0].deviceBrand);
$("#equipment_model_details").val(rowData[0].deviceModel);
$("#shelf_position_details").val(rowData[0].position);
$("#equipment_sn_details").val(rowData[0].deviceSN);
$("#equipment_pn_details").val(rowData[0].devicePN);
$("#operating_system_details").val(rowData[0].operatingSystem);
$("#input_date_details").val(rowData[0].inTime);
$("#retirement_time_details").val(rowData[0].warrantyTime);
$("#service_mode_details").val(rowData[0].serviceMode);
$("#service_life_details").val(rowData[0].useYear);
$("#manufacturer_details").val(rowData[0].supplyCom);
$("#remarks_details").val(rowData[0].remarks);
$("#subordinate_system_details").val(rowData[0].subordinateSystem);
$("#installation_location_details").val(rowData[0].installationLocation);
$("#whether_state-owned_details").val(rowData[0].whetherState_owned);
$("#factory_number_details").val(rowData[0].serialNumber);
// });
$("#myModalLabel_details").text('详情');
$("#equipment_details").removeClass("hidden");
$("#button_sub_details").addClass('hidden');
$("#button_sub_details").addClass('modal-footer');
$("#myModal_details").modal();
} else {
toastr.error("加载错误");
}
});
功能就是点击按钮,根据id查询对应的信息,然后在前台展示~