问题描述:假设有一个留言板,在管理员页面有“回复“和“删除“2个功能,点击回复以后表单直接提交执行回复操作,但点击删除时需要弹出一个确认框,当用户确认以后才能提交执行删除操作。显然这里就需要用到客户端脚本。
下面是我的做法:
服务器端:使用VB.net
客户端:适用JavaScript
表单的部分代码如下:
<form id="Form1" method="post" runat="server" onsubmit="return inputValidate()">
...
<asp:Button id="Button1" tabIndex="2" runat="server" Text="回复"></asp:Button>
<INPUT type="reset" value="重置">
<asp:Button id="Button2" runat="server" Text="删除"></asp:Button>
...
</form>
因为表单有2个按钮,所以表单提交前需要判断提交的按钮是哪个。可以采用下面语句
event.srcElement.id
或者
event.srcElement.value
来判断是哪个按钮提交了。
一开始你可能认为这个判断应该写在inputValidate()函数里面,在表单发生提交事件的时候判断。
但实际上这是不行的,因为我们需要的事件源是提交按钮,那么这个判断就只能写按钮的click事件函数里面。
但是这样又如何控制表单提交呢,因为和表单提交有关系的是submit事件函数。
好在click事件发生在submit事件之前
,这样就有了下面的这个解决办法:
设
一个中间变量,在click事件发生的时候把event.srcElement.id或者event.srcElement.value保存下来
,在之后的submit事件中判断这个中间值,然后采取不同的动作。
代码如下:
<script language="javascript">
<!--
var bt;
function check(){
bt=event.srcElement.value
}
function inputValidate(){
if (bt=="删除")
return confirm("确实要删除留言吗?");
else{
//do someting
}
return true;
}
//-->
</script>
如果细心的话,你会发现在上面的表单里面我没有为删除按钮指定click事件的方法。这是因为这个按钮是一个服务器控件,如果你在标签中指定onclick属性内容,服务器将这个内容和一段服务器代码关联起来,而我门现在需要的是和客户端代码关联。
怎么解决呢?
好在服务器控件的Attributes属性有Add方法,可以动态给控件加属性和属性的值。
这里加的属性就不会被误认为是绑定服务器端代码了。
在Page_Load方法中加入下面代码。
Me.Button2.Attributes.Add("onclick", "check()")
这样一来,整个问题就解决了。
分享到:
相关推荐
除了上述方法,还有其他处理多按钮表单的方式,例如使用JavaScript在客户端进行预处理,或者在服务器端使用更复杂的逻辑来判断按钮。然而,对于简单的场景,使用PHP判断表单提交值的方式已经足够实用。 需要注意的...
但是,如果希望在同一个表单中实现多个功能,则需要借助客户端脚本来动态改变`action`属性的值,从而控制表单提交的目标地址。 #### HTML结构 首先,我们需要构建一个包含多个按钮的表单: ```html <!-- 提交...
总结来说,“html5点击弹出手机登录注册表单提交代码”涉及到HTML5的表单元素、CSS的显示控制、JavaScript事件处理、表单验证、离线存储以及AJAX提交等多个知识点。理解和掌握这些技术,将有助于构建高效、用户友好...
- **禁用表单按钮**:在表单提交后,禁用提交按钮,防止用户点击多次。 - **使用POST/REDIRECT/GET模式**:在处理POST请求后,使用`sendRedirect()`重定向到一个新的GET请求,这样刷新页面不会再次执行POST。 - **...
当用户在网络条件不佳或系统响应较慢的情况下连续点击按钮时,可能会导致多次触发相同的操作,如提交表单、执行数据库操作等,进而引发一系列的问题,比如数据冗余、不必要的服务器负载增加等。 #### 方法概述 ...
- JavaScript禁用表单提交:在提交表单后,可以禁用提交按钮,以防止用户再次点击。 - 使用HTTP-only cookies:存储一个提交标志,当表单提交后设置此标志,后续请求检查该标志以防止重复提交。 - **结合服务器...
在网页上,通常会有一个HTML表单,包含各种输入元素如文本框、文本区域、选择列表等,用户填写信息后点击提交按钮,这些数据就会被发送到服务器。在服务器端,ASP脚本接收到这些数据,并根据预设的逻辑进行处理,...
在客户端限制表单重复提交是Web开发中一个重要的实践,主要目的是防止用户意外或恶意地多次提交同一份数据,导致数据库出现重复记录或者系统逻辑出错。本文将详细阐述两种客户端限制表单重复提交的方法,并结合...
当用户点击提交按钮后,可能会因为网络延迟、误操作等原因而重复点击提交按钮,导致数据被多次发送到服务器,从而引发一系列的问题,比如数据库记录重复插入等。 #### 一、问题分析 在 ASP.NET 中,用户通过点击...
在有多个提交按钮的情况下,可以使用JavaScript来禁用所有的提交按钮,确保在任一按钮被点击后,其它所有按钮都处于不可用状态。文档提供了一段示例代码,通过`document.getElementsByName('t1')`获取所有名为`t1`的...
当用户点击提交按钮多次或者由于网络延迟导致的重复提交,服务器可能会接收到相同的数据请求多次,这可能会对业务逻辑产生不良影响。例如,在电商网站中,如果用户多次点击购买按钮,可能会导致订单数量错误。 为了...
在这个过程中,`a.aspx`页面作为客户端表单的发起者,通过POST或GET方法将数据提交到`b.aspx`页面进行处理,然后`b.aspx`根据接收到的数据进行业务逻辑操作,并可能返回相应的结果给用户。 1. **HTML表单(Form)**...
JavaScript作为客户端脚本语言,可以用来实现这一功能,以避免用户无意或恶意地连续点击提交按钮,导致服务器接收到重复的请求。本示例主要探讨如何在JavaScript中实现防止表单重复提交的功能,并结合一个简单的登录...
当用户快速连续点击提交按钮,特别是在网络延迟或页面响应较慢的情况下,浏览器可能会发送多个请求,导致表单数据被多次提交。为了避免这种情况,我们需要采取措施来限制用户只能提交表单一次。 一种常见的解决方案...
1. **使表单按钮失效**:即在用户点击提交按钮后使其失效,以确保表单只能被提交一次。这种方法虽然简单有效,但用户体验较差,尤其是在用户不小心多次点击提交按钮时,可能会导致数据丢失或操作中断。 2. **清除...
例如,可以监听按钮点击事件,当用户提交表单时触发数据验证和发送数据到服务器。 3. 数据提交:Flash表单通常使用HTTP协议通过XMLHttpRequest对象(或在较早版本中使用LoadVars类)向服务器发送POST或GET请求,将...
然而,这里提到的是一个特殊的情况,即表单数据被提交到同一个页面,并且页面使用JavaScript来捕获和处理这些提交的参数。 在Web开发中,表单提交是用户与网页交互的重要方式,常用于收集用户输入的数据。表单通过`...
当用户点击提交按钮后,由于网络延迟或刷新页面等原因,可能会导致同一个表单的数据被多次发送到服务器。例如,如果用户在购物网站上添加商品到购物车,重复提交可能导致商品数量异常增加,对业务逻辑造成影响。 ...
在`jqueryvalidationDemo`这个压缩包中,包含了一个使用jQuery Validation插件进行多表单、多按钮、分组验证的示例项目。你可以下载并运行这个项目,以便更深入地了解如何在实际项目中应用这些功能。 通过以上介绍...
当用户点击提交按钮时,浏览器会发送一个HTTP请求到服务器,请求中包含了表单内的所有数据。对于POST请求,这些数据会被包含在请求体中。 在C#.Net中,我们可以使用`System.Net.HttpWebRequest`类来模拟这种行为。...