怎么样用ajax来提交数据到后台数据库,并完成交互呢?????
一、当我们在验证表单的时候,为了阻止把错误的也发送到服务器,我们通常这样设置:
    $(function(){
      var isusername;(定一个变量)
       var ispwd;
        $('form').submit(function(e){
            if(!isusername || !ispwd){
                e.preventDefault();(阻止事件的默认事件)
          })
    });
   1、在nodejs中我们可以用以下方法来(加载)跳转页面:
        JQuery 中的load()  这是实行加载一个页面
        window.location()  这是在windows下跳转到一个指定的页面
   
二、 node.js中MongoDB的安装步骤及相关操作:

1.下载安装程序。(windowXP只能使用2.2以前的版本,window7以上系统可以使用最新版本)下载地址:http://www.mongodb.org/downloads

2.开始安装MongoDB。如果是XP系统可以直接将安装目录拷贝到指定的目录下。如果win7系统则运行安装程序,可以自己选择安装路径。(注意安装路径不要出现中文)安装好的MONgoDB默认在C:\Program Files\MongoDB\Server\3.2\bin
 
      3.在安装的同一目录下创建一个目录data,然后在data目录中创建db目录和log目录。
      4.在命令行里输入 cd C:\Program Files\MongoDB\Server\3.2\bin回车
         再输入mongo。进行mongo.exe操作界面。
      5.开始运行MongoDB。可以通过以下命令将MongoDB的程序安装到windows的服务中。
       最后打开命令行,切换到MongoDB的bin目录下。运行:
       mongod.exe --dbpath "c:\data\db" --logpath "c:\data\log\mongodb.log" --install
      6.在mongo.exe中我们可以完成增、删、改、查:下面依次介绍
       在这之前我们可以用show dbs来查看当前mongo中的所有数据库,如果没有就用use f30(先找有没有F30,如果没有就自动创建一个名为f30的数据库)
         1>增加:db.users.insert({maen:'dd',age:20})
       增加后,可能用db.users.find()来看是否增加成功
         2>删除:db.users.remove({maen:'dd'}) 或 db.users.remove({})  (这是删除users里面的所有数据)
         3>修改:db.users.update({maen:'dd'},{age:22})   把名字dd的年龄修改为22
         4>查找:db.users.find({age:{$gt:20})  查找大于20的数据
 
 三、我们可以通过BUTTON来提交数据 ,并跳转到登录界面,代码如下 :
           $("input[type=button]").click(function(e){
                if(!isUsernameValid || !isPwdValid){  //用if语句来判断当用户名或者密码有一个为false时就弹出一个消息框,并提示:请输入正确的信息。
                    alert('请输入正确的信息');
                    return;    //结束
                }
                $.ajax({             //用ajax来实现不刷新网页的基础上更新数据
                    type:"post",  //请求方式
                    url:"/users/reg",  //路径
                    data:{
                        username:$("input[name=username]").val(),   //获取input中name为username的值
                        pwd:$("input[name=pwd]").val()  //获取input中name为pwd的值
                    },
                    success:function(){
                        alert("注册成功");
                        window.location = "login.html";  //注册成功就跳转到login.html
                    }
                });
                
            })

以上代码就是用ajax的方式来实现注册功能。个人名言:每天进步一点点,相信成功是属于有准备的人!!!

利用ajax的方式来提交数据到后台数据库及交互功能的更多相关文章

  1. 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据

    jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...

  2. FIREDAC(DELPHI10 or 10.1)提交数据给ORACLE数据库的一个不是BUG的BUG

    发现FIREDAC(DELPHI10 or 10.1)提交数据给ORACLE数据库的一个不是BUG的BUG,提交的表名大小写是敏感的. 只要有一个表名字母的大小写不匹配,ORACLE就会认为是一个不认 ...

  3. $.ajax 提交数据到后台.

    //AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML -- (Extensible Markup Language 可扩展标记语言 ...

  4. 利用Ajax和JSON实现关于查找省市名称的二级联动功能

    功能实现的思路:我们经常碰见网上购物时候填写收件地址会用到这个查找省市县的三级联动查找功能,我们可以利用Ajax和JSON技术模拟这个功能,说白了同样是使用Ajax的局部数据更新功能这个特性.因为省市 ...

  5. ODP方式,大批量数据写入ORACLE数据库

    项目中在同步数据的时候,需要把获得的数据DataTable,写入oracle数据库 因为System.Data.OracleClient写入方式写入大批量数据特别慢,改用Oracle.DataAcce ...

  6. ORACLE用户管理方式下备份数据和复制数据库

    首先要明确的是,oracle数据库的备份可以分为逻辑备份和物理备份.           逻辑备份的是通过数据导出对数据进行备份,主要方式有老式的IMP/EXP和数据泵灯方式.适合变化较少的数据库,而 ...

  7. form表单提交数据给后台

    1.完整登录示例 1. form表单往后端提交数据注意三点 1.所有获取用户输入标签都应该放在form表单里面 2.action属性控制往哪儿提交,method一般都是设置成post 3.提交按钮必须 ...

  8. Ajax.BeginForm的异步提交数据 简介

    Html.BeginForm与Ajax.BeginForm都是MVC架构中的表单元素,它们从字面上可以看到区别,即Html.BeginForm是普通的表单提交,而Ajax.BeginForm是支持异步 ...

  9. 登录(ajax提交数据和后台校验)

    1.前台ajax数据提交 <form id="login_form" action="" method="POST"> < ...

随机推荐

  1. Mongo基础使用,以及在Express项目中使用Mongoose

    MongoDB的基本使用 MongoDB特点: 使用BSON存储数据 支持相对丰富的查询操作(相对其他nosql数据库) 支持索引 副本集(支持多个实例/多个服务器运行同个数据库) 分片(数据库水平扩 ...

  2. 安全的将excel导入sqlite3的解决方案

    最近在做一个小项目时,需要把一个excel中的数据保存到sqlite3数据库中以备后用,表中有字符也有数字,要用到特定的数据类型方便后续使用,参照网上的方法,将excel文件转换为csv文件后,在导入 ...

  3. DIV+CSS中标签dl dt dd常用的用法

    转自:http://smallpig301.blog.163.com/blog/static/9986093201010262499229/ < dl>< /dl>用来创建一个 ...

  4. C# 金钱 小写转大写的算法

    调用 ConvertMoney的ConvertMoneyToWords(decimal money)方法即可 using System; using System.Collections.Generi ...

  5. 修改NavigationView中的Item的Icon大小

    <dimen name="navigation_icon_size">48dp</dimen>

  6. python之platform模块

    python之platform模块 ^_^第三个模块从天而降喽!! 函数列表 platform.system() 获取操作系统类型,windows.linux等 platform.platform() ...

  7. JavaScript 操作 Cookie

    转自作者:聂微东出处:http://www.cnblogs.com/Darren_code/      什么是 Cookie “cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器 ...

  8. springMVC中 request请求数据绑定到Controller入参 过程剖析

    前言:Controller方法的参数类型可以是基本类型,也可以是封装后的普通Java类型.若这个普通Java类型没有声明任何注解,则意味着它的每一个属性都需要到Request中去查找对应的请求参数.众 ...

  9. JS基础学习(一)

    首先感谢 http://www.w3school.com.cn/js/index.asp 学js真的很方便,&下面的内容其实是我自己做的一个备忘 第一节 大致了解 一 js基本介绍 1.轻量级 ...

  10. Windows平台手动卸载Oracle Server【完整+干净】

    使用Oracle自带的Universal Installer卸载存在问题: 不干净,不完全,还有一些注册表残留,会影响到后来的安装. 所以,推荐使用手工卸载Oracle. 1.[win+R]-> ...