首页 > 代码库 > jsp中一行多条数据情况

jsp中一行多条数据情况

2024-08-08 07:22:10   218人阅读

1.实现效果：点击新增会在之前文本框后一直新增文本框并且保留新增的图片
效果图：

123_thumb[2]

2.jsp代码：

<table class="Business_Table">        <tr>            <td class="TableLabel_Left TableLabel_Tip">                <span style="float:left" class="bold">附着高度</span>            </td>        </tr>    </table>    <div style="display: none" id="fzgdTableTbodyTemp"><!--主要是为了po对象字段及显示字段问题 -->        <ww:hidden name="fzgdList[].id" id="fzgdList[]_id" />        <ww:hidden name="fzgdList[].wxyqkid" id="fzgdList[]_wxyqkid" />        <ww:hidden name="fzgdList[].lsbz" id="fzgdList[]_lsbz" />        <ww:hidden name="fzgdList[].gcid" id="fzgdList[]_gcid"/>        <ww:hidden name="fzgdList[].gccode" id="fzgdList[]_gccode"/>        <ww:hidden name="fzgdList[].cjsj" id="fzgdList[]_cjsj"/>        <div style="display: none"><ww:checkbox name="RP_VISIBLE"  theme="simple" /></div>        <div style="background-color: #00bfff;" style="width: 100%;text-align:center;">第()道</div>        <div>            <ww:textfield name="fzgdList[].fzgd" id="fzgdList[]_fzgd" theme="simple"                          subNum="2" precision="2" validType="length[1,6]"    cssClass="txtBox easyui-numberbox" />        </div>    </div>    <div style="display: none" id="fzgdTableTbodyImg"><!--主要是为了图片的问题 -->        <td class="Page_TableText_Center"  style="width: 20%"  onm ousemove="this.bgColor=‘yellow‘" onm ouseout="this.bgColor=‘#FFFFFF‘">            <img src=http://www.mamicode.com/"/skin/silver/images/add.gif" alt="" onclick="addFzgd(‘fzgdTableTbody‘)"/>>
 
3.js增加方法：
function addFzgd(tbodyid){        var checkls = document.getElementsByName("RP_VISIBLE").length-2;//标示当前所含有的td个数        var _copy = $("#" + tbodyid + "Temp").html();   //需要添加的html        var addHtml = $("#" + tbodyid + "Img").html();        var imgHtml = $("#" + tbodyid+" tr:last-child td:last-child").html();  //获取最后一行的最后一个td        if(checkls%5 == 0){ //此时表示如果添加则到下一行            $("#" + tbodyid).html($("#" + tbodyid).html().replace(imgHtml,_copy));            $("#" + tbodyid).append("<tr style=‘height: 55px‘>"+addHtml+"</tr>");        }  else{  //在本行添加            $("#" + tbodyid).html($("#" + tbodyid).html().replace(imgHtml,_copy));//将添加图片替换，然后新增一行            $("#" + tbodyid+" tr:last-child").append(addHtml);        }        //重置对象List下标        var listName = "";        if (tbodyid.indexOf("fzgd") != -1) {            listName = "fzgdList";        }        $("#" + tbodyid + " tr td").each(function (i) {            $(this).find("input,div").each(function () {                var fieldname = $(this).attr("name");                if (fieldname != undefined) {                    fieldname = fieldname.split("].")[1]                    $(this).attr("name", listName + "[" + i + "]." + fieldname);                    $(this).attr("id", listName + "[" + i + "]_" +fieldname);                } else{                    if($(this).text().indexOf("第(") != -1){                        $(this).text("第("+(i+1)+")道");                    }                }            });        });    }
4.需要做的配置:在XxxAction的同级目录下新建XxxAction-conversion.properties,文件内容为
Element_fzgdList=com.xx.xx.xx.xx.po.TpzFzgdCreateIfNull_fzgdList=true
jsp中一行多条数据情况


联系
我们