欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

asp.net浏览器向服务器提交json格式的数据

程序员文章站 2023-11-05 13:23:16
原型界面如下 vcd4kpggxpr7fzow5pstcpc9omt4kpha+pc9wpgo8cd4gicagicagidghos/cwk2/8qo6tq/mrldztqjk/b7dv+lk/...

原型界面如下

asp.net浏览器向服务器提交json格式的数据

喎? f/ware/vc/"="" target="_blank" class="keylink">vcd4kpggxpr7fzow5pstcpc9omt4kpha+pc9wpgo8cd4gicagicagidghos/cwk2/8qo6tq/mrldztqjk/b7dv+lk/b7do7s8l3a+cjxwpiagicagicagmqgiobamizqzo6gxsltfpao6taw798qxo6zu2rjdzpxp7ss/tctwsb3tz8k3vcztvnpsu8z10mk1xl2xs83m9cs/o7s8l3a+cjxwpiagicagicagm6giobatobgwtmwlo7rwu9pq0rvm9b2xs83m9cs/yrgjrmflv9xk5mjrv/le2sjdo6y38dtyo6zjvrp9umo9sbpnzpxev6o7pc9wpgo8cd4gicagicagidshosihz/uwtmwlo7q1pbv3y6lqwtkzw+y8l3a+cjxwpiagicagicagnagisao05rc0xawjurwlu/fksaos0enwpnpdu6fk5mjr0mxporxe1f3it9duo6y9q9pdu6fk5mjr0mxpotequ7voqmpzb24mizi2njg0o8q9tctk/b7do6yw0wpzb24mizi2njg0o8q9tctk/b7d0uyyvczhvbu4+lf+zvhg9zwvcd4kpha+pgjypgo8l3a+cjxomt6+38zlyrxp1jwvade+cjxomj7ss8pm1krl2mtayn0oym9kectayn0ppc9omj4kpggzprt6wus8l2gzpgo8cd48chjlignsyxnzpq=="brush:java;">

市直单位名称:

奖惩项目名称: 分数:

页面元素由3大块内容组成,具体看原型图,其中最为关键的内容就是第二部分,实现动态增加元素的功能,利用节点的克隆来实现。


“+”按钮功能的实现

代码

//添加新的奖惩项目
        function addrow(id) {
            //获得内层p元素节点
            var selementnode = document.getelementbyid(id).parentnode;

            //克隆一套新的标签元素(内层p):奖惩名称和分数
            var clonedelementnode = selementnode.clonenode(true);

            //设置克隆的属性(id和value)   没有对克隆的属性进行设置也没有什么影响
            //1、获得新一套标签元素的统一标号
            var newid = parseint($("input[value = '+']").length);
            //2、设置p的id
            clonedelementnode.id = "s" + newid;
            //3、设置p内部元素的属性
            clonedelementnode.childnodes.item(1).id = "txtaddname" + newid;
            $(clonedelementnode.childnodes.item(1)).val("编辑");
            clonedelementnode.childnodes.item(3).id = "txtaddcount" + newid;
            $(clonedelementnode.childnodes.item(3)).val("编辑");
            clonedelementnode.childnodes.item(5).id = "cmdadd" + newid;
            $(clonedelementnode.childnodes.item(5)).val("+");
            clonedelementnode.childnodes.item(7).id = "cmddel" + newid;
            $(clonedelementnode.childnodes.item(7)).val("-");

            //将克隆元素添加到外层div中
            //1、外层p元素节点
            var felementnode = selementnode.parentnode;
            //2、添加
            if (felementnode.lastchild == selementnode) {
                //当前节点为最后一个元素节点
                felementnode.appendchild(clonednode);
            } else {
                //当前节点不是最后一个元素节点
                felementnode.insertbefore(clonedelementnode, selementnode.nextsibling);
            } 
        }

对于克隆出来的元素的属性,可以重新定义,也可以不用,因为后面都是通过元素的class属性进行操作的。


“-”按钮功能的实现

代码

//删除选中的奖惩项目
        function delrow(id) {
            //1、获取当前节点的内层p  
            var selementnode = document.getelementbyid(id).parentnode;
            //2、获取当前节点的外层p
            var felementnode = selementnode.parentnode;
            //3、删除内层p
            if (felementnode.childnodes.length > 3) {
                //a、元素节点大于2
                felementnode.removechild(selementnode);
            } else {
                //b、只有一个元素节点
                $(selementnode.childnodes.item(1)).val("");
                $(selementnode.childnodes.item(3)).val("");
                $(selementnode.childnodes.item(5)).val("+");
                $(selementnode.childnodes.item(7)).val("-");
            }
        }

这里对于是否只有一条奖惩条目的判断,用的是孩子节点,因孩子节点包括了所有的节点类型(文本节点,元素节点,注释节点),所以,在代码中会看到3(注释为注释节点,注释的两边有相应的空格,分别为一个文本节点)


取消按钮功能的实现

代码

//取消按钮,重新加载页面
        function reload() {
            window.location.href = "cityaddinput.aspx";
        }

保存按钮功能的实现

代码

//保存奖惩项目
        function saveadd() {
            //有效性验证
            if ($('#cc1').combobox('gettext') == "") {
                alert("请选择市直单位名称!");
                return;
            }

            //获得奖惩项目的个数
            var txtnamecount = parseint($("input[name='txtname']").length);
            //获得所有奖惩项目名称节点
            var txtallname = document.getelementsbyname("txtname");
            //获得所有奖惩项目分数节点
            var txtallcount = document.getelementsbyname("txtcount");

            //有效性输入的判断
            for (var i = 0; i 

json.stringify(object)可以把一个对象转换为json数据格式的字符串


文本框获得焦点的相应代码

//点击编辑的时候如果内容为编辑的话那就把value值清空,如果不是的话证明人家已经编写了就不清空了
        function iffull(txtelementnode) {
            if (txtelementnode.value == "编辑") {
                txtelementnode.value = "";
            }
        }


总结

一个大的功能,分割成多个小的功能,然后确定一个实现的流程
喎?>