`

最原始的ajax实现前台验证

    博客分类:
  • Ajax
阅读更多
<script type="text/javascript">
var request;
function createRequest(){
try{
request=new XMLHttpRequest();
}catch(trymicrosoft){
try{
request=new ActiveXobject("Msxml2.XMLHTTP");
}catch(othermicrosoft){
try{
request=new ActiveXobject("Microsoft.XMLHTTP");
}catch(failed){
request=false;
}
}
}
if(!request)
alert("Error initializing XMLHttpRequest!");
}

function getCustomerInfo(){
createRequest();
var modelsName=document.getElementById("CDictionaryName").value;

while ((modelsName.indexOf(" ")==0) && (modelsName.length>1)){
modelsName=modelsName.substring(1,modelsName.length);
}//去除前面空格
while ((modelsName.lastIndexOf(" ")==modelsName.length-1)&&(modelsName.length>1)){
modelsName=modelsName.substring(0,modelsName.length-1);
}//去除后面空格
if (modelsName==" "){
modelsName="";
}

var url="<%=basePath%>models.do?method=selectModelsByName&modelsName="+modelsName;
url=encodeURI(url);
  url=encodeURI(url); //写一个不行。如果写一个就是????号。
  //写2个,则输出 %df%a4这中.

request.open("GET",url,true);
request.onreadystatechange=updatePage;
request.send(null);
}
function updatePage(){
if(request.readyState==4)
{
if(request.status==200)
{
var modelsName=document.getElementById("CDictionaryName");
var responseText=request.responseText;
if(responseText=="车型已存在"){
modelsName.value="";
modelsName.focus();
document.getElementById("mName").innerHTML=responseText+"!请重新换个名字!";
}else{
document.getElementById("mName").innerHTML=responseText
}
}
else if (request.status==404)
{
modelsName.value="";
alert("Request URL does not exist");
}else{
alert(modelsName.value);
modelsName.value ="";
alert("Error:status code is "+ request.status);
}
}
}
</script>
<script type="text/javascript">
function sub(){
var mName=document.getElementById("CDictionaryName");
if(mName.value==""){
document.getElementById("mName").innerHTML="对不起!车型不能为空!";
return false;
}else{
return true;
}
}
</script>


后台Action代码:
// 根据ID查看
public ActionForward selectModelsByName(ActionMapping mapping,
ActionForm form, HttpServletRequest request,
HttpServletResponse response) {
String cIictionaryName = request.getParameter("modelsName");
try {
cIictionaryName = java.net.URLDecoder.decode(cIictionaryName,"UTF-8");
} catch (UnsupportedEncodingException e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
} //这句话一定要,因为如果不写的 //话,编码 就 是%E5%A6%88%System.out
System.out.println(cIictionaryName+"aaaaaaaa");
//response.setContentType(arg0)
try {
response.setContentType("text/html;charset=utf-8");
PrintWriter out=response.getWriter();
Dictionary dictionary=new Dictionary();
dictionary.setCDictionaryFlag("1");
dictionary.setCDictionaryName(cIictionaryName);
List<Dictionary> reList=dictionaryService.findByExample(dictionary);
if(reList.size()>0){
out.print("车型已存在");
}else {
out.print("该车型可以使用!");
}
out.close();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}
分享到:
评论

相关推荐

    Jquery+Ajax实现的前台登陆验证(

    在本文中,我们将深入探讨如何使用Jquery和Ajax技术实现前端登录验证,并通过Servlet与DBUtils库进行数据库交互。这是一套适用于初学者的学习案例,旨在帮助他们掌握这些核心技术。 首先,`Jquery`是一个流行的...

    AJAX实例的表单验证

    `formValidate_ajax.js`是我们的JavaScript代码,用于实现AJAX功能。在JavaScript中,我们可以使用`XMLHttpRequest`对象或者更现代的`fetch` API来发送异步请求。在这个实例中,当表单提交时,我们阻止其默认的提交...

    简单Ajax前台后台实例

    在本实例中,我们利用Ajax实现了一个简单的超市收银台功能,它可以根据商品的数量动态计算总价,为用户提供即时反馈,提高了用户体验。 首先,我们要了解Ajax的工作原理。Ajax的核心是XMLHttpRequest对象,它允许...

    前台ajax与后台json传递

    在实际应用中,Ajax与Json结合使用可以实现各种复杂的交互,例如用户登录验证、表单提交、动态加载内容等。通过Ajax,我们可以实现无刷新的用户体验,而Json则简化了数据的序列化和反序列化过程,使得前后端的数据...

    Javascript前台简单验证插件2

    这篇博客文章"Javascript前台简单验证插件2"可能介绍了一种改进版的前端验证解决方案,通过链接可以访问到更多详细内容。 在前端验证中,JavaScript扮演了核心角色,因为它是浏览器内唯一可以实时与用户交互并处理...

    php与ajax实现文章管理.rar

    本文将深入探讨如何使用PHP和AJAX实现文章管理系统的相关知识点。 首先,PHP(Hypertext Preprocessor)是一种服务器端的脚本语言,常用于Web开发,可以嵌入到HTML中,用于处理服务器端的数据。在这个文章管理系统...

    javaScript前台验证实例

    这个"javaScript前台验证实例"的压缩包很可能包含了多种常见的前端验证示例,旨在帮助开发者理解和应用JavaScript进行有效的用户输入检查。 1. **用户名密码验证**: 在网页表单中,用户注册或登录时,通常需要...

    AJAX前台应用

    1. **表单验证**:在用户提交表单前,可以使用AJAX验证输入的有效性,避免不必要的页面跳转。 2. **动态加载内容**:如无限滚动、分页加载,用户滚动到底部时自动加载更多内容。 3. **实时通讯**:例如聊天应用,...

    AJAX Star 无刷新投票前台实现

    总结,实现AJAX Star无刷新投票前台涉及到前端JavaScript的AJAX调用、事件监听和DOM操作,以及后端的数据库交互和状态管理。理解这些知识点对于构建动态Web应用至关重要。通过实践,你可以进一步提升技能,创造出更...

    页面输入前台JS验证通用脚本

    10. **AJAX**:如果需要在验证过程中发送数据到服务器进行校验,例如防止重复的用户名,脚本可能会使用AJAX异步请求。 通过理解和掌握这些知识点,开发者可以有效地利用"页面输入前台JS验证通用脚本"来创建高效且...

    ajax+php实现的鼠标悬停打分

    而"rating-前台界面.rar"则包含用户与之交互的HTML和CSS代码,可能还涉及一些JavaScript逻辑,实现了评分星星的动态效果和AJAX请求的触发。 总结起来,这个项目展示了如何结合AJAX、PHP和jQuery实现一个实时的鼠标...

    前台form 验证js大全

    例如,React中可以使用`onChange`事件实时验证,Vue中则可通过`v-model`及计算属性实现。 七、现代验证API HTML5引入了一些内置的验证特性,如`required`、`pattern`、`min`、`max`等属性,以及`reportValidity()`...

    jquery验证,较强的前台验证

    通过`remote`规则,可以向服务器发送AJAX请求验证数据。 ```javascript rules: { username: { required: true, remote: "check-username.php" } }, messages: { username: { remote: "该用户名已被注册" } }...

    Ajax 上传图片 前台后台都有 代码简单易懂 总共加起来不到80行

    利用Ajax技术进行图片上传,可以实现用户在上传图片时获得更好的交互体验。 #### 二、前后端分离与集成 **1. 前后端职责划分:** - **前端**主要负责用户的界面交互逻辑处理,包括获取用户选择的文件、构建请求等...

    Ajax实现异步刷新验证用户名是否已存在的具体方法

    Ajax实现异步验证的步骤 在上述文档的示例中,当用户在账号输入框失去焦点时,触发`loadXMLDoc`函数。该函数首先检查输入框中的用户名是否为空,如果为空,则显示提示信息。如果输入不为空,则通过JavaScript发起...

    关于jquery.validate1.9.0前台验证的使用介绍.docx

    本文将详细介绍如何在实际项目中使用 jQuery Validate 1.9.0 进行前台验证。 ### 1. 阻止未验证通过的表单提交 问题在于,如果没有正确地处理验证,表单可能会在未通过验证的情况下仍然提交。解决这个问题的关键是...

    Ajax示例-简单会员注册 v1.0

    在“Ajax示例-简单会员注册 v1.0”这个项目中,我们将深入探讨如何利用Ajax实现一个高效、流畅的会员注册流程。 **Ajax工作原理** 1. **用户交互**:当用户在前端填写表单并触发某个事件(如点击注册按钮)时,...

    asp.net+ajax实现无刷新的增删改查

    以下是使用jQuery AJAX实现ASP.NET无刷新增删改查的基本步骤: 1. **添加jQuery库**:首先,在ASP.NET页面头部引入jQuery库,可以通过CDN链接或者本地文件引用。 2. **创建ASP.NET控件**:在页面上放置需要进行...

    javascript+我的第一个前台页面完全验证

    记住,实践是学习的最佳途径,尝试自己编写验证代码并不断优化,你会逐渐掌握JavaScript前台验证的技巧。 总的来说,学习JavaScript前台验证是前端开发中的基础技能,也是提升用户体验的关键。通过学习和实践,你...

    OA工作流WorkFlow版本(前台JS实现)

    在"OA工作流WorkFlow版本(前台JS实现)"中,重点是使用JavaScript在前端实现工作流的相关功能。JavaScript作为客户端脚本语言,使得用户可以在浏览器中直接交互,提高用户体验,同时也减轻了服务器端的压力。 1. **...

Global site tag (gtag.js) - Google Analytics