在同一页面上提交表单后弹出模态

编程入门 行业动态 更新时间:2024-10-27 06:30:41
本文介绍了在同一页面上提交表单后弹出模态的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我是一个新手,我不知道如何做到这一点。

I am a total novice and i don't know how to make this.

我想要的是什么:

当我在页面的表单上单击提交时,它将转到servlet并将数据加载到数据库中。然后作为负载的确认,它显示成功模态。 我想实现servlet不重定向的东西。也就是说,它会停留在同一页面上并显示弹出的数据成功模式。

When I click submit on my page's form, it will go to the servlet and load the data in the database. Then as a confirmation of load, it show a success modal. I want to achieve something in which the servlet does not redirect. That is, it stays on the same page and show a "Data lodaded successfully" modal that pops up.

我正在使用 response.sendRedirect 重定向到我的servlet 中的另一个页面,但我不想重定向,我想留在同一个页面中,弹出窗口显示在表单页面中。

I am using response.sendRedirect to redirect to another page in my servlet but I don't want to redirect, I want to stay in the same page with a pop up appearing in the form page.

推荐答案

您可以使用jquery-ui轻松实现这一目标。

You can achieve that very easily by using jquery-ui.

您可以添加jquery-ui有两种方式:

You can add jquery-ui in 2 ways:

1)将此链接放在< head> 标签内

1) Put this links inside your <head> tags

<link rel="stylesheet" href="//code.jquery/ui/1.10.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery/jquery-1.9.1.js"></script> <script src="//code.jquery/ui/1.10.4/jquery-ui.js"></script>

OR

2)下载文件并将它们添加到您的网站(与上面相同,但文件将在您的域上)。 推荐

2) Download the files and add them to your website (same as above but files will be on your domain). Recommended

您在内部任何位置创建一个空div < body> 标记:

You create an empty div anywhere inside you <body> tags:

<div id="modal_popup"> </div>

然后添加以下代码。

<script type="text/javascript"> $(document).ready(function() { $(function() { $( "#modal_popup" ).dialog({ autoOpen: false, height: 140, modal: true, title: "The title of your modal popup", open: function(){ $( "#modal_popup" ).append("The text that you want in the modal."); } }); }); $( "#submit_id" ).click(function(){ $( "#modal_popup" ).dialog('open'); }); }); </script>

编辑

<script type="text/javascript"> function pop_up_modal() { $( "#modal_popup" ).dialog({ height: 140, modal: true, title: "The title of your modal popup", open: function(){ $( "#modal_popup" ).append("The text that you want in the modal."); } }); }; </script>

然后你可以随时随地拨打 pop_up_modal()在您的servlet上。

You can then call pop_up_modal() anywhere on your servlet.

更多推荐

在同一页面上提交表单后弹出模态

本文发布于:2023-11-24 21:26:33,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1626901.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:弹出   表单   页面   模态   在同一

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!