jquery ajax提交json格式的数据,后台接收并显示各个属性

我的表单如下:

<form onsubmit="return false">
            <ul>
                <li><span>用户名</span> <input type=‘text‘ placeholder=‘请输入用户名‘
                    name=‘user‘></li>
                <li><span>密码</span> <input type=‘text‘ placeholder=‘请输入密码‘
                    name=‘pwd‘></li>
                <li><span>爱好</span> <input type=‘checkbox‘ value=‘bike‘>bike
                    <input type=‘checkbox‘ value=‘football‘>football <input
                    type=‘checkbox‘ name=‘car‘>car</li>
                <li><span>居住地</span> <input type=‘text‘ name=‘address‘>
                </li>
                <li><input type=‘hidden‘ name=‘like‘></li>
                <li><input type=‘submit‘ value=‘提交‘ onclick=‘sub()‘></li>
            </ul>
        </form>

提交的数据如下:

function sub() {
        var data = {
            like : []
        };
        $(‘:checkbox:checked‘).each(function() {
            data.like.push($(this).val());
        })
        //console.log(data.like);
        $.ajax({
            type:‘post‘,
            url:‘list.do‘,
            dataType : "json",
            data: {data:JSON.stringfy(data)},
            error:function(){
                alert("失败");
            },
            success:function(){
                alert("成功");
            }
        })
    }

后台获取数据:

public void service(ServletRequest req, ServletResponse res)
            throws ServletException, IOException {
        try {
            JSONObject jo = new JSONObject(req.getParameter("data"));
            Iterator it = jo.keys(); // gets all the keys

            while (it.hasNext()) {
                String key = (String) it.next(); // get key
                Object o = jo.get(key); // get value
                System.out.println(key + " : " + o); // print the key and value
            }
        } catch (JSONException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }

    }

参考页面:

http://stackoverflow.com/questions/19568142/how-to-read-json-sent-by-ajax-in-servlet

http://blog.csdn.net/wangxiaohu__/article/details/7254598

时间: 2024-10-19 18:59:01

jquery ajax提交json格式的数据,后台接收并显示各个属性的相关文章

ajax 上传文件,post上传文件,ajax 提交 JSON 格式的数据

ajax简介 前后台做数据交互 前后端做数据交互的方式(三种): (1)浏览器窗口输入地址(get的方式)(2)form表单提交数据(3)ajax提交数据 特点 特点: (1)异步 异步与同步的区别:同步是请求发过去,要等着回应:异步不需要等待,可以进行其他操作 (2)局部刷新 使用 使用: (1)url:匹配的路由 (2)type:发送的的方式 (3)data:发送的数据 (4)success:发送的数据成功回调条数 $('.btn').click(function () { $.ajax({

ajax 提交 json格式数据到后台

例子:$.ajax({ type: 'POST', url: "/ROOT/modify.do", contentType: "application/json",//如果想以json格式把数据提交到后台的话,这个必须有,否则只会当做表单提交 data: JSON.stringify({"name":"sam","age":"12"}),//JSON.stringify()必须有,否则只

关于ajax接受json格式的数据

<body> <form action=""> <select id="college" name="college" ></select> </form> <script> var xmlHttp = ""; function getXmlHttpRequest(){ if(window.XMLHttpRequest) xmlHttp = new XML

关于ajax接受json格式的数据二(使用jquery方式)

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <

通过js,修改所有form表单,提交JSON格式的数据

直接上代码 <script>$(function(){ //获取网页中所有的form表单 $("form").each(function(){ //注册表单的提交事件 $(this).submit(function(event) { //屏蔽表单的注册 event.preventDefault(); //获取url var url = $(this).attr("action"); request(url, 'POST', JSON.stringify(

javascript 解析ajax返回的xml和json格式的数据

写个例子,以备后用 一.JavaScript 解析返回的xml格式的数据: 1.javascript版本的ajax发送请求 (1).创建XMLHttpRequest对象,这个对象就是ajax请求的核心,是ajax请求和响应的信息载体,单是不同浏览器创建方式不同 (2).请求路径 (3).使用open方法绑定发送请求 (4).使用send() 方法发送请求 (5).获取服务器返回的字符串   xmlhttpRequest.responseText; (6).获取服务端返回的值,以xml对象的形式存

PHP接收JSON格式的数据

在API服务中,目前流行采用json形式来交互. 给前端调用的接口输出Json数据,这个比较简单,只需要组织好数据,用json_encode($array) 转化一下,前端就得到json格式的数据. 接收前端提交的json数据稍微复杂一点,原因是:PHP默认识别的数据类型是application/x-www.form-urlencoded标准的数据类型.因此,对型如text/xml 或者 soap 或者 application/octet-stream 和application/json格式之类

Django-choices字段值对应关系(性别)-MTV与MVC科普-Ajax发json格式与文件格式数据-contentType格式-Ajax搭配sweetalert实现删除确认弹窗-自定义分页器-批量插入-07

目录 models 字段补充 choices 参数/字段(用的很多) MTV与MVC模型 科普 Ajax 发送 GET.POST 请求的几种常见方式 用 Ajax 做一个小案例 准备工作 动手用 Ajax 实现效果 contentType 前后端传输数据编码格式 ajax 提交数据 ajax发 json 格式数据 ajax 传文件 序列化组件 利用 sweetalert 搭建页面(弹窗) 弹窗中文支持不太好,手动修改样式 页面数据没刷新的问题 自定义分页器 批量插入测试数据 bulk_creat

AJAX制作JSON格式的局部实时更新数据的方法

废话不多,上代码,前台: 主要使用了死循环一秒钟读取JS一次去刷新页面(递归的思想)单独对ShowData这个DIV的数据进行刷新 ,个人觉得还是需要优化的.请大神指点 <script type="text/javascript"> $(function () { var i = 0; function setTimeOutPost() { $.ajax({ type: "post", url: "/UserControl/DoData.ash