zoukankan      html  css  js  c++  java
  • 转载 ----HTML5 ---js实现json方式提交数据到服务端

    json提交给服务器我们在提交之前需要通过js的相关函数来把数据转换成json格式的数据再进行post或get了,下面来看看。
     

    大概需求就是前端要把数据组装成json,传给后端。首先,在客户端,通过javascript脚本将页面表单数据封装成json格式.getjsondata()函数完成了这一功能.然后我们通过$.ajax()方法将数据发送到服务端,其中用到了json.stringify()方法,它可以将客户端发送地数据转换成json对象

    直接上代码:

     代码如下 复制代码

     $.ajax({  
            type: "POST",  
            url: "RequestData.ashx",  
            contentType: "application/json; charset=utf-8",  
            data: JSON.stringify(GetJsonData()),  
            dataType: "json",  
            success: function (message) {  
                if (message > 0) {  
                    alert("请求已提交!我们会尽快与您取得联系");  
                }  
            },  
            error: function (message) {  
                $("#request-process-patent").html("提交数据失败!");  
            }  
        });  
    });  
      
    function GetJsonData() {  
        var json = {  
            "classid": 2,  
            "name": $("#tb_name").val(),  
            "zlclass": "测试类型1,测试类型2,测试类型3",  
            "pname": $("#tb_contact_people").val(),  
            "tel": $("#tb_contact_phone").val()  
        };  
        return json; 

    上面的例子是在博客园找到的 ,但这是最简单的一种json格式,我们在做项目中肯定会遇到json里有数组,然后我改造了以下,也直接上代码吧,

     代码如下 复制代码

    $.ajax({  
           type: "POST",  
           url: "RequestData.do",  
           contentType: "application/json; charset=utf-8",  
           data: JSON.stringify(GetJsonData()),  
           dataType: "json",  
           success: function (message) {  
               if (message > 0) {  
                $(".posting").remove();  
                   $(".main_con").append("<p style='text-align:center; padding:20px 0; background:#03f430;color:#fff;'>提交数据成功!</p>");  
               }  
           },  
           error: function (message) {  
            $(".posting").remove();  
            $(".main_con").append("<p style='text-align:center; padding:20px 0;background:#f4031a;color:#fff;'>提交数据失败!</p>");  
           }  
       });  
       function GetJsonData() {  
        var teamdata=[];  
        for(var i=0; i<$(".onjob-lsit tr").length; i++){  
            var teamobj ={  
                "teamRelname":$(".teamRelname").eq(i).text(),   
                "teamTel":$(".teamTel").eq(i).text(),   
                "teamStartDate":$(".teamStartDate").eq(i).text(),   
                "teamEndtDate":$(".teamEndtDate").eq(i).text(),   
                "teamRemark":$(".teamRemark").eq(i).text()  
            };  
            teamdata.push(teamobj);  
        }  
          
        var json = {  
            "onteamName": $(".onteamName").val(),  
            "forteamName": $(".forteamName").val(),  
            "teamList":teamdata  
              
        };  
        return json;  
        } 

    php如何接收post过来的JSON数据

    POST过来的JSON数据,一般直接用接受就好
    打个比方

    JavaScript code
     
    ?
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    var allUnivList = [{
            "id": 1,
            "univs": [{
                "id": 1001,
                "name""清华大学"
            },
            {
                "id": 1002,
                "name""北京大学"
            }],
            "country_id": 0,
            "name""北京"
        }]
     
    //比如你传递的是上面这个JSON格式,在PHP端,举个用JQ提交的例子:
    $.ajax({
                    url: "test.php",
                    type: "post",
                    data: { allcity: allUnivList},
                    success: function (data) {                  
                          alert(data);
                    },
                    error: function () {
                        alert("系统异常!");
                    }
                });


    以上是JS部分,以下是PHP部分:

    PHP code
     
    ?
    1
    2
    3
    //一般直接使用
    $allcity=$_POST['allcity'];
    echo $allcity['name'];


    这样alert出来的结果应该是北京

      mysql_set_charset('utf8');
    $datas=$_GET['getDatas'];
    //print_r($datas);
    $user = json_decode($datas,true);
       // echo var_dump($user);
       print_r($user); 

    转载网站:

    http://www.111cn.net/wy/jquery/112697.htm

    http://bbs.csdn.net/topics/390643303

  • 相关阅读:
    002powershell使用常见问题
    028_如何外网下载大文件
    028MAC常用工具unlicense
    027_录屏倒计时弹窗实用小程序
    NIO相关基础篇
    写给刚上小学一年级的果果(家长寄语)
    [转]Mavlink协议
    [原][ARCGIS]使用ARCMAP分离导出单个矢量图形文件SHP
    [原][译]从osgEarth2升级到osgEarth3的变化
    [减肥]生酮减肥餐做法
  • 原文地址:https://www.cnblogs.com/shenlaiyaoshi/p/6125941.html
Copyright © 2011-2022 走看看