英文:
How to access and store the input hidden field of a jsp page which is changing dynamically on button clicks?
问题
以下是在 JSP 页面中的脚本:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#trno=${track.track_no}" class="album-poster" data-switch="${count}" data-value="${track.track_no}">播放按钮</a>
<input type="hidden" id="trnum" name="trnum" value="">
以下是您编写的 JavaScript 脚本:
$(".album-poster").on('click', function(e) {
var dataSwitchId = $(this).attr('data-switch');
var datavalue = $(this).attr('data-value');
//将值添加到隐藏字段
$('#trnum').val(datavalue);
//显示隐藏字段的值
console.log($('#trnum').val())
ap.list.switch(dataSwitchId);
ap.play();
$("#aplayer").addClass('showPlayer');
});
在这里,锚标签位于 foreach 循环中,因此不同的值将存储在锚标签的 data-value 属性中。
您想将这些数据值存储到数据库中,以便在尝试访问时可以像这样:
$(".album-poster").on('click', function(e) {
var dataSwitchId = $(this).attr('data-switch');
var datavalue = $(this).attr('data-value');
//将值添加到隐藏字段
$('#trnum').val(datavalue);
//显示隐藏字段的值
console.log($('#trnum').val())
<%System.out.println(request.getParameter("trnum"));%>
ap.list.switch(dataSwitchId);
ap.play();
$("#aplayer").addClass('showPlayer');
});
在突出显示的代码中,您正在控制台中打印 null。要将这些值存储到数据库并将其访问,请使用 Java 代码来处理。
您需要创建一个后端接口来处理从前端传递的数据,然后将这些数据存储到数据库中。通常,您可以使用 Java 的框架,如 Spring 或 Servlet,来处理此任务。在 Java 中,您可以通过接收 HTTP 请求参数来访问从前端传递的数据,然后将其插入到数据库中的相应表中。
这里提供了一般的思路,但具体的实现会取决于您的后端技术栈和数据库选择。如果您需要更详细的指导,请提供有关您的后端技术和数据库的更多信息。
英文:
here is the script that in the jsp page
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#trno=${track.track_no}" class="album-poster" data-switch="${count}" data-value="${track.track_no}">Play Button</a>
<input type="hidden" id="trnum" name="trnum" value="">
here is the js script that I wrote
$(".album-poster").on('click', function(e) {
var dataSwitchId = $(this).attr('data-switch');
var datavalue = $(this).attr('data-value');
//Add value to hidden field.
$('#trnum').val(datavalue);
//Show hidden field value
console.log($('#trnum').val())
ap.list.switch(dataSwitchId);
ap.play();
$("#aplayer").addClass('showPlayer');
});
here the anchor tag is in the foreach loop such that of different values will be there in the data-value attribute in the anchor tag
here I want to store these data values to the database such that when I'm trying to access like
$(".album-poster").on('click', function(e) {
var dataSwitchId = $(this).attr('data-switch');
var datavalue = $(this).attr('data-value');
//Add value to hidden field.
$('#trnum').val(datavalue);
//Show hidden field value
console.log($('#trnum').val())
****<%System.out.println(request.getParameter("trnum"));%>****
ap.list.switch(dataSwitchId);
ap.play();
$("#aplayer").addClass('showPlayer');
});
in the highlighted code that I'm printing in the console it is printing null I need these values which are clicked to store them into the database and how can I get access them and store into the java list.
how can I do it ?
答案1
得分: 1
你需要将数据提交到服务器以访问request
对象。实现这一目标的一种方式是使用ajax。您可以将用户点击的datavalue
发送到后端并保存它。因此,您的jquery代码将如下所示:
$(".album-poster").on('click', function(e) {
var dataSwitchId = $(this).attr('data-switch');
var datavalue = $(this).attr('data-value');
//检查datavalue是否不为null
if (datavalue != null) {
$.ajax({
url: "your_backend_url", //url或servlet
type: "GET",
data: {
trnum: datavalue
}, //将数据传递给后端,可以在doGet方法servlet中使用request.getParameter("trnum")访问它
success: function(data) {
console.log("done"); //这将在浏览器控制台中成功打印
}
});
}
ap.list.switch(dataSwitchId);
ap.play();
$("#aplayer").addClass('showPlayer');
});
在后端,获取用户传递的数据,使用request.getParameter("trnum")
进行进一步操作。
英文:
You need to submit your data to server to access request
object .One way to achieve this is using ajax .You can send the datavalue
which is clicked by user to backend and save it .So your jquery code will look like below :
$(".album-poster").on('click', function(e) {
var dataSwitchId = $(this).attr('data-switch');
var datavalue = $(this).attr('data-value');
//chcking if datavalue is not null
if (datavalue != null) {
$.ajax({
url: "your_backend_url", //url or servlet
type: "GET",
data: {
trnum: datavalue
}, //pass data to backend access same using request.getParameter("trnum") in doGet method servlet
success: function(data) {
console.log("done");//this will print on success in browser console
}
});
}
ap.list.switch(dataSwitchId);
ap.play();
$("#aplayer").addClass('showPlayer');
});
At backend get that data which is passed by user using request.getParameter("trnum")
and do further operations .
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论