问题提出:利用ajax请求来验证注册时选择的登录名是否已经被注册,问题是每次都会出现未注册,即使是数据库中已经存在有此登录名。
后台程序:
@RequestMapping(value = "duplicate", method = RequestMethod.GET, consumes = MediaType.APPLICATION_JSON_VALUE) @ResponseBody public ResponseEntity<Object> duplicate(@RequestParam(value = "loginName") String loginName) { try { UserDto userDto = developerService.findByLoginName(loginName); if (userDto == null) { userDto = new UserDto(); userDto.setLoginName(loginName); return new ResponseEntity(userDto, HttpStatus.OK); } else { return new ResponseEntity(userDto, HttpStatus.OK); } } catch (CoreException e) { logger.error(e.getMessage()); e.printStackTrace(); return new ResponseEntity(null, HttpStatus.INTERNAL_SERVER_ERROR); } }
后台请求接口:
url: "${ctx}/developer/duplicate",
约定格式:application/json
传输数据:
data: {"loginName": loginName},
验证登录名是否合法:
合法才提交请求验证登录名是否已注册,否则登录名不合法不能请求服务。
function checkLoginName(loginName){ if(......){ ......... return false; }else if(duplicate(loginName)==true){ .......... return false; }else{ ....... return true; } }
当请求到检验是否重名的函数duplicate(loginName)时:
function duplicateLoginName(loginName) { var dup = false; $.ajax({ type: "GET", url: "${ctx}/developer/duplicate", contentType: "application/json", dataType: "json", data: {"loginName": loginName}, beforeSend: function () { $("#loginNameTips").text("正在验证...").css("color", "red"); }, error: function (data, XMLHttpRequest) { $("#loginNameTips").text("×验证失败:").css("color", "red"); }, success: function (data) { if (data.id == null) dup = false;//未重名 else dup = true;//重名 } }); return dup; }
理想结果:若重名,则该函数返回false,否则返回true
实际结果:如果重名,会执行dup=true,不重名,执行dup=false,但是返回的dup始终是初始化的值false,结果是无论重名与否,结果都显示不重名,为什么呢?
原因分析:ajax默认是异步传输,也就是说,方法并没有等待 success:function(data) 回调函数执行完,就已经向下执行了。这就是dup一直未初始化值false的原因所在。
解决办法:利用同步传输,添加上async:false即可,
相关推荐
当用户输入信息时,JavaScript监听输入事件,一旦满足触发条件,就发送AJAX请求到服务器。服务器端执行相应的检查,如果返回的数据表示验证通过,则在前端显示成功提示;反之,显示错误信息,这样用户无需提交表单就...
本话题主要探讨如何利用Ajax实现用户注册时验证用户名是否已存在的功能,以及Rapid Validate工具的使用。 首先,当用户在注册界面输入用户名时,我们可以使用Ajax发送异步请求到服务器,查询数据库中该用户名是否已...
5. **响应处理**:Ajax请求完成后,会触发onreadystatechange事件,通过status和responseText属性获取服务器返回的状态码和数据。 6. **更新界面**:根据服务器的响应,前端更新界面。比如,显示登录成功消息或错误...
"异步验证登录名是否存在"是Web应用程序中的一个关键功能,它允许用户在输入用户名时实时检查该用户名是否已被占用,而无需刷新整个页面。这种功能通常通过JavaScript和Ajax技术来实现,其中"vs-ajax"可能是指Visual...
在“jQuery-ajax-用户名异步请求”这个场景中,我们可能是在设计一个注册或登录界面,需要在用户输入用户名时实时检查该用户名是否已被占用。这个过程可以通过Ajax调用后台接口实现,避免用户频繁提交表单进行检查。...
1. **事件监听**:为登录按钮添加点击事件监听器,当按钮被点击时,触发Ajax请求。 2. **创建XMLHttpRequest对象**:在JavaScript中,通过`new XMLHttpRequest()`创建一个新的XMLHttpRequest实例。 3. **初始化请求*...
url: "check_login.php", // 验证登录的服务器端脚本 type: "POST", // HTTP请求类型 data: {username: username, password: password}, // 发送的数据 success: function(response) { if (response === ...
在分析该系统时,我们可以通过查看源代码、网络请求以及响应数据来了解其AJAX登录验证的具体实现方式。 总之,AJAX登录验证是现代Web应用中常见的功能,它结合了前端和后端技术,实现了高效且流畅的用户体验。在...
综上所述,".NET AJAX账号注册验证是否存在"是一个涉及客户端和服务器端交互的Web开发过程,主要知识点包括ASP.NET AJAX的使用、AJAX请求与响应处理、SQL查询以及前端验证和反馈显示。这个功能提高了用户体验,使得...
通常会生成一个随机字符串或图像,然后通过AJAX请求将其显示在前端。 4. **error.asp**:当注册过程中出现错误时,此页面可能会显示错误信息。在ASP中,可以设置错误处理机制,如`On Error Resume Next`或`On Error...
3. **编写检查方法**:在Controller中,添加一个处理Ajax请求的方法,例如`checkLoginName Availability`,该方法接受登录名作为参数,通过数据库查询判断登录名是否已存在。 4. **使用Ajax**:在前端,当用户输入...
【Ajax验证用户名是否...总结来说,Ajax验证用户名存在的技术核心包括:前端JavaScript的Ajax请求、后端Java处理请求和响应、以及数据库查询。这种方式提高了用户体验,避免了不必要的页面刷新,使验证过程更加流畅。
虽然这里没有提供具体的源代码,但通常一个简单的Ajax请求示例如下(使用现代浏览器的fetch API): ```javascript function checkUsername(username) { fetch('/api/check_username', { method: 'POST', ...
这个名为"ajax用户名验证(取个名字真难啊)"的项目,显然是利用Ajax来实现用户注册或登录时的用户名实时验证功能。通过Ajax,用户在输入用户名时可以立即得到服务器端的反馈,确认该用户名是否已被占用,从而提供更...
至于ajax自动验证登录注册,代码示例中提到的是通过javascript实现异步数据验证,即在不刷新页面的情况下验证用户输入的数据,并给予即时反馈。虽然示例文件中未提供完整的ajax验证实现代码,但是根据描述可知,其...
在C#中,我们需要创建一个Web方法或控制器方法来处理Ajax请求。例如,我们可以创建一个名为`RegisterUser`的方法,接收前端发送的用户名和密码等参数,进行必要的验证,并返回一个JSON响应,包含注册结果和可能的...
在这个项目中,PHP负责处理来自Ajax的请求,包括验证用户输入、处理注册和登录逻辑、与数据库交互等。 3. **注册功能**:`reg.php`可能包含了用户注册的逻辑。这通常包括检查用户名是否已存在、验证邮箱格式、密码...
2. **Ajax请求**:当用户提交注册信息后,使用Ajax发送POST请求到`/api/AsyncRegister`。请求体中携带用户信息,如用户名和密码的哈希值。 3. **服务器处理**:在服务器端,`.NET`代码接收请求并执行以下操作: - ...
总结来说,通过结合jQuery的AJAX功能和服务器端的简单逻辑,我们可以创建一个实时验证用户名是否可用的登录系统。这种方法不仅提高了用户体验,也减少了不必要的服务器负载,因为它只在需要时才进行数据库查询。在...
3. **响应处理**:在Ajax请求的`success`回调中,接收到后端返回的JSON数据。解析这个JSON,根据登录状态提示用户。如果登录成功,可以跳转到新的页面或者显示欢迎信息;如果失败,展示错误信息。 三、HTML页面设计...