Thinkjs使用ajax实现表单提交
//前端代码
1 $('form').submit(evt=>{
evt.preventDefault();//阻止表单默认提交
$.ajax({
url: '/user/personal/update',
type: 'POST',
dataType: 'json',
data: $('form').serialize(),
success:res=>{
if(!res.errno) alert('上传成功!');
else alert('res.errmsg');
}
});
});
//后台(controller)-src/user/controller/update.js
1 async indexAction(){
return this.display();
}
async updateAction(){//通过post的方式来获取值即可
let userList = this.model('user');
let userInfo = await this.session('userInfo');
let formData = this.post();//获取所有传进来的表单数据
let affectedRows = await userList.where({user_loginname: userInfo.login}).update({user_name: this.post('inputNickname'),user_mailbox:this.post('inputEmail'),user_tellphone:this.post('inputTell'),user_city:this.post('inputCity')});
this.success();//此接口的返回值
}
前端通过serialize()序列化,后端通过this.post(key)获取即可,key就是html中表单元素的name值。
Serialize()的结果是一个字符串,类似表单提交的字符串。Eg:'a=1&b=cccc'。
Ajax中的type是'post',所以后端中通过this.post(key)方式获取即可。
Ps:ajax的type如果是'get',那么后端通过this.get('key')获取即可。
Ps2:在后端相当于没有用ajax,和 直接通过form的post和get提交的那种获取数据方式是相同的,但是如果要区分的话,可以通过下面这种方式来获取
具体可以参照thinkjs官方文档中的controller.get(),controller.post和controller.parma()的具体内容(https://thinkjs.org/zh-cn/doc/2.2/api_controller.html)
Thinkjs使用ajax实现表单提交的更多相关文章
- ajax的表单提交,与传送数据
ajax的表单提交 $.ajax ({ url: "<%=basePath%>resource/addPortDetectOne.action", dataType: ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件
最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...
- Ajax form表单提交
1. 使用 $("form").serialize() 来获取表单数据 $.ajax({ type: 'post', url: 'your url', data: $(" ...
- ajax模拟表单提交,后台使用npoi实现导入操作 方式二
页面代码: <form id="form1" enctype="multipart/form-data"> <div style=" ...
- ajax模拟表单提交,后台使用npoi实现导入操作 方式一
页面代码: <form id="form1" enctype="multipart/form-data"> <div style=" ...
- 不使用Ajax,如何实现表单提交不刷新页面
不使用Ajax,如何实现表单提交不刷新页面? 目前,我想到的是使用<iframe>,如果有其他的方式,后续再补. 举个栗子: 在表单上传文件的时候必须设置enctype="mul ...
- MVC中处理表单提交的方式(Ajax+Jquery)
MVC中处理表单有很多种方法,这里说到第一种方式:Ajax+Jquery 先看下表单: <form class="row form-body form-horizontal m-t&q ...
- form表单提交和ajax表单提交,关于移动端如何通过软键盘上的【搜索】和【前进】进行提交操作
[文章来源]由于自己对于form研究甚少,所以一直用的都是AJAX进行提交,这次后台提出要用form提交,顺便深入研究一下:之前在做表单的时候,发现input可以通过设置不同的type属性,调用不同的 ...
随机推荐
- MD5加密Demo
package com.util; import java.security.MessageDigest; public class MD5 { public final static String ...
- jmeter压力测试报告 - DEMO
XXX压力测试报告 时间:2015-08-04 测试人员:xxx 目录 XXX压力测试报告... 1 一 测试 ...
- [补] windows C socket编程——大物实验预约
注 : 心血来潮,想着把这两年没能记录下来的经历,写一波回忆杀.诚然,有些经历十分复杂繁琐,希望能耐下性子,写出好文章来,可惜一时不能全想起来这两年来的种种,就想起来什么便写什么吧. 时间估摸着是大一 ...
- linux下 git 安装
1.使用yum安装 yum -y install git yum remove git 2.源代码安装 a.下载git源码 网址为 https://github.com/git/git/releas ...
- 在同一个sql语句中,统计不同条件的Count数量
前几天帮同事优化了个SQL,原写法使用多个子查询这里不再重现了,大家都遇到过这样一种情况,在项目后期的维护中, 修改别人的SQL代码,超过30行的语句,多层子查询,读起来很坑,时间久的项目伴随着人员的 ...
- 删除物品[JLOI2013]
题目描述 箱子再分配问题需要解决如下问题: (1)一共有N个物品,堆成M堆. (2)所有物品都是一样的,但是它们有不同的优先级. (3)你只能够移动某堆中位于顶端的物品. (4)你可以把任意一 ...
- git入门(3)git checkout 和git branch分支的创建和删除
在一个项目中,需要多人同时开发,协同coding 要求: 开发时请用开发分支daily/0.0.1, 禁止直接使用master分支开发新建分支 git checkout -b daily/0.0.1 ...
- Django 最好的缓存memcached的使用 小记
嗯,咳咳咳咳咳,这是在win平台上.linux平台上没折腾 首先你要在win上安装 Memcache 下载 :点我下载 里面有x64 和 x86 的.根据自己的系统版本来选择使用 使用命令行: 1 ...
- 66. Plus One【leetcode】
Given a non-negative integer represented as a non-empty array of digits, plus one to the integer. Yo ...
- 从Javascript单线程谈Event Loop
假如面试回答js的运行机制时,你可能说出这么一段话:"Javascript的事件分同步任务和异步任务,遇到同步任务就放在执行栈中执行,而碰到异步任务就放到任务队列之中,等到执行栈执行完毕之后 ...