Я сделал jqgrid, в котором есть столбец для кнопок.При нажатии на эту кнопку я хочу передать rowObject (параметр rollno) сервлету.Как я могу сделать это, создав динамическую форму, созданную jquery, и отправить параметр сервлету?
Я пытаюсь получить данные из базы данных, включая файл, и показать их в jqgrid. Я успешно сохранилполя формы, включая файл в базе данных и вставленный в jqgrid. Я хочу загрузить один и тот же загруженный файл по нажатию кнопки на каждой строке в одном столбце.
Код JQGrid с функцией форматирования кнопки.
jQuery(document).ready(function() {
$("#list").jqGrid({
url : "ViewController",
datatype : "json",
mtype : 'POST',
colNames : [ 'rollno', 'name', 'percentage', 'File', 'FileName' ],
colModel : [ {
name : 'rollno',
index : 'rollno',
width : 100
}, {
name : 'name',
index : 'name',
width : 150,
editable : true
}, {
name : 'percentage',
index : 'percentage',
width : 150,
editable : true
}, {
name : 'File',
index : 'File',
formatter: ButtonFormatter,
editable : true
},
],
pager : '#pager',
rowNum : 10,
rowList : [ 10, 20, 30 ],
sortname : 'invid',
sortorder : 'desc',
viewrecords : true,
gridview : true,
edittype: 'file',
editoptions: {
enctype: "multipart/form-data"
},
caption : 'Data Report',
jsonReader : {
repeatitems : false,
},
});
jQuery("#list").jqGrid('navGrid', '#pager', {
edit : true,
add : true,
del : true,
search : true
});
});
function getJQGrid(){
jQuery("#list")
.jqGrid('setGridParam',
{
datatype: 'json',
url:'ViewController'
})
.trigger("reloadGrid");
}
function ButtonFormatter(cellvalue, options, rowObject) {
var id = rowObject[0];
return "<input type='button' value='somevalue' onclick='somefunction(+rowObject[0]+)'\>";
}
function somefunction(id){
alert(id);
}
Страница JSP
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<title>Records</title>
<link rel="stylesheet" href="jqueryJs/jquery-ui.css">
<link rel="stylesheet" href="gridJs/css/ui.jqgrid.css">
<script src="jqueryJs/external/jquery/jquery.js"></script>
<script src="gridJs/js/i18n/grid.locale-en.js"></script>
<script src="gridJs/js/jquery.jqGrid.src.js"></script>
<script src="jqueryJs/jquery-ui.js"></script>
<script src="js/getJqGridData.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
$('.error').hide();
$("#submit_btn").click(function() {
$('.error').hide();
var rollno = $("input#rollno").val();
if (rollno == "") {
$("label#rollno_error").show();
$("input#rollno").focus();
return false;
}
var name = $("input#name").val();
if (name == "") {
$("label#name_error").show();
$("input#name").focus();
return false;
}
var percent = $("input#percentage").val();
if (percent == "") {
$("label#percentage_error").show();
$("input#percentage").focus();
return false;
}
var dataString = 'Rollno='+ rollno + '&name=' +name + '&percentage=' + percent;
});
$("#submit_btn").click(function (event) {
//stop submit the form, we will post it manually.
event.preventDefault();
// Get form
var form = $('#formid')[0];
// Create an FormData object
var data = new FormData(form);
// If you want to add an extra field for the FormData
data.append("CustomField", "This is some extra data, testing");
// disabled the submit button
$("#submit_btn").prop("disabled", true);
$.ajax({
type: "POST",
enctype: 'multipart/form-data',
url: "HomeController",
data: data,
processData: false,
contentType: false,
cache: false,
timeout: 600000,
success: function (data) {
$("#result").text(data);
console.log("SUCCESS : ", data);
$("#submit_btn").prop("disabled", false);
},
error: function (e) {
$("#result").text(e.responseText);
console.log("ERROR : ", e);
$("#submit_btn").prop("disabled", false);
}
});
});
});
</script>
</head>
<body>
<h3>Student Records</h3>
<div id="contact_form">
<form enctype="multipart/form-data" method="post" id="formid">
<div>
Roll no: <input type="text" name="rollno" id="rollno"> <label
class="error" for="rollno" id="rollno_error">This field is
required.</label>
</div>
<br>
<div>
Name: <input type="text" name="name" id="name" /> <label
class="error" for="name" id="name_error">This field is
required.</label>
</div>
<br>
<div>
Percentage: <input type="text" name="percentage" id="percentage" />
<label class="error" for="percentage" id="percentage_error">This
field is required.</label>
</div>
<br>
<div>
File: <input type="file" name="file" size=50 /> <label
class="error" for="file" id="file_error">This field is
required.</label>
</div>
<br>
<div>
<input type="submit" value="Submit" class="button" id="submit_btn" />
</div>
</form>
</div>
<table id="list">
<tr>
<td />
</tr>
</table>
<div id="pager"></div>
</body>
</html>