美文网首页
jq中的弹窗与范文(常见表格和按钮弹窗,ajax遍历)

jq中的弹窗与范文(常见表格和按钮弹窗,ajax遍历)

作者: 任笙_8b8c | 来源:发表于2020-09-17 15:23 被阅读0次

- jq弹窗

  • 这里是弹窗的提示 全为输入框 ,可以用文本域进行赋值
<!-- 新增提示框 start -->
<div id="LoginBox1" class="popUpBox" >
    <div class="row1" style="line-height: 50px;height: 50px;border-bottom: 1px solid #f4f4f5;color:#333333;font-size:20px;font-weight: bold;background-color: #e8f3fb;text-align: center;">
        <input id="addtype" type="hidden" value="" />
        <input id="sysUserId" type="hidden" value="" />
        <input id="orgId" type="hidden" value="" />
        <input id="sysUserRoleId" type="hidden" value="" />
        <input id="staffId" type="hidden" value="" />
        <span id="head">详情</span><a href="javascript:void(0)" title="关闭窗口" class="close_btn0" id="closeBtn1"></a>
    </div>
    <div style="font-weight: normal;">
        <div class="pContent">
            <div class="pContent">
                <div class="pDetailContent" style="">
                    <div id="hh" class="leftTile" style=""></div>
                    <div  class="leftInput" style="height: 42px;">

                        <%--<textarea cols="25" rows="5"></textarea>--%>
                        <textarea disabled cols="25" rows="5"  id="staffname6" class="class-companyInfo asterisk " type="text"  style="width: 727px;float: left;"></textarea>
                        <span style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;</span>
                    </div>
                </div>
            </div>

        </div>
        <%--<div class="row1" style="border-top: 1px solid #f4f4f5;margin-top: 20px;padding-top: 10px;color:#333333;text-align: center;">
            <div style="width: 100%;height: 30px;line-height: 30px;">
                <input id="saveButton" type="button" value="保存" onclick="saveButtonC(this)" style="background-color:#ffa524;border:1px solid #e5e5e5;border-radius:4px;height:30px;width:99px;font-size: 15px;" />
                <input id="subCancel1" type="button" class="sub_btn" value="取消" style="background-color:#ffa524;border:1px solid #e5e5e5;border-radius:4px;height:30px;width:99px;font-size: 15px;margin-left: 20px;"/>
            </div>
        </div>--%>
    </div>
</div>
  • 触发弹窗事件
    str += "<td  title='+split+'><span onclick='bolur()'>"+split+"……"+"</span></td>";
  • 给文本域赋值
    $("#staffname6").val(list[0].resourceDescription)
  • 设置弹窗
    function bolur(){
            initBox();
            $("#USER_TYPE").attr('disabled',true)
            //$("#role").attr('disabled',true)
            $("#industryselect").hide()
            $("#bg_1").css({display:'block'});
            $("#LoginBox1").fadeIn("slow");
            $("#head").text("描述详情");
    }

初始化弹窗

//初始化弹框
    function initBox(){
        $('#username1').val('')
        $('#staffname1').val('')
        $('#HN_PARK_ID').val('');
        $('#CITY_CODE').val('');
        $('#AREA_CODE').val('');
        $('#BIZ_MODULE').val('');
        $('#USER_TYPE').val('province')
        $("#BIZ_MODULE").attr("name","")
        $('#role').val('')
        $('#org_select').val('')
        $('#sysUserId').val('')
        $('#orgId').val('')
        $('#sysUserRoleId').val('')
        $('#staffId').val('')
        $("#USER_TYPE").attr('disabled',false)
        $("#role").attr('disabled',false)
        $("input[type='checkbox']").each(function() {
            this.checked = false;
        });
        $("#areaSelect").hide()
        $("#PARK_SELECT").hide()
        $("#org_select_div").show()
        $("#industryselect").show()
        /* var data = (${data});
        var sysUserList = data.sysUserRole;
        if(data.parentList){
            initCitySelect(data.parentList);
        }
        if(data.areaList){
            initAreaSelect(data.areaList);
        }*/
    }

范文

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/include/cust-head.jsp"%>
<%@ include file="/WEB-INF/include/menu-name-list.jsp"%>
<script src="${ctx}/static/js/page.js" type="text/javascript"></script>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<style>
    .list_button{
        float: right;
        width: 88px;
        height: 40px;
        border: none;
        border-radius: 5px;
        box-shadow: none;
        font-size: 18px;
        background-color: rgba(102, 204, 0, 1);
        color: #FFFFFF;
        text-align: center;
        margin-left: 22px;
    }
    .ki_header{
        margin-top: 0px;
        padding-top: 12px;
        margin-left: 1px;
    }
    .pDetailContent{
        color:#555555;font-size:16px;padding-left: 20px;width: 100%;
    }
    .leftTile{
        width: 120px;float: left;text-align: right;
        font-size: 16px;
        color: #555555;
        font-weight: normal;
        margin-top: 4px;
    }
    #hh{
        margin-left: -15%;
        margin-top: 3%;
    }

    #staffname6{
        width: 390px !important;
        height: 73px !important;
        float: left !important;
    }

    .leftInput{
        height: 92px;
        padding-bottom:12px;
        font-size: 15px;
        font-weight: normal;
    }
    .class-companyInfo{
        text-indent:20px;border:1px solid #cccccc;border-radius:4px;height:30px;width:227px;
        font-size: 15px;
        font-weight: normal;
    }


    .content {
        padding: 10px;
        margin-right: 0px;
    }

    .content-div{
        width: 100%;
        color:#555555;
        font-size:14px;
        background: #ffffff;
        padding-left:20px;
        padding-right:20px;
    }

    .box_div{
        height: 69px;
        line-height: 69px;
        display: inline;
    }

    .c_title{
        font-weight: bold;
        font-size: 16px;
        color: #555555;
    }

    .companyName-Input{
        width:197px;
        height:32px;
        border: 1px solid #e5e5e5;
        border-radius: 5px;
    }

    .class-item{
        border:1px solid #e5e5e5;
        border-radius: 5px;
        padding-left:10px;
        width: 150px;
        height:32px;
        font-size: 16px;
        color: #666666;
    }

    .newCompanyUser-div{
        background:#f4f4f5;
        height: 50px;
        padding: 0px;
        padding-top: 10px;
    }

    .newCompanyUser-div-div{
        height: 35px;
        width: 150px;
        text-align: center;
        line-height: 35px;
        background: dodgerblue;
        border-radius: 5px;
        color: #ffffff;
        font-size: 16px;
        cursor: pointer;
    }

    #dataTable{
        width: 100%;
        max-width: 100%;
        margin-bottom: 20px;
    }

    #dataTable thead tr{
        background-color: #e8f3fb;
        height: 46px;
        line-height: 46px;
        font-size: 16px;
    }

    #dataTable thead tr th{
        border-right: 1px solid #ddd;
    }

    .table>tbody>tr>td,.table>thead>tr>th{
        padding: 18px;
    }

    /*弹框start*/
    .popUpBox {
        position: absolute;
        left: 10%;
        top: 10%;
        border: 3px solid #f4f4f5;
        background: white;
        width: 940px;
        height: 500px;
        z-index: 10000;
        display: none;
    }
    .close_btn0 {
        background-image:url(${ctx}/static/images/accessoryManager/close.png);
        width:22px;
        height:22px;
        text-decoration: none;
        position: absolute;
        right:-11px;
        top:-11px;
    }
    .sub_btn{
        width: 55px;
        height: 30px;
        line-height: 30px;
        border: 1px solid dodgerblue;
        border-radius: 5px;
    }
    /*弹框end*/

</style>
<%--
产业数据页
--%>
<html>
<body>
<%--遮罩--%>
<div id="bg_1"style="position:absolute;width:100%;height:100%;background: #fff;z-index:100;display:none;opacity: 0.5;"></div>
<!-- 新增提示框 start -->
<div id="LoginBox1" class="popUpBox" >
    <div class="row1" style="line-height: 50px;height: 50px;border-bottom: 1px solid #f4f4f5;color:#333333;font-size:20px;font-weight: bold;background-color: #e8f3fb;text-align: center;">
        <input id="addtype" type="hidden" value="" />
        <input id="sysUserId" type="hidden" value="" />
        <input id="orgId" type="hidden" value="" />
        <input id="sysUserRoleId" type="hidden" value="" />
        <input id="staffId" type="hidden" value="" />
        <span id="head">资源申请</span><a href="javascript:void(0)" title="关闭窗口" class="close_btn0" id="closeBtn1"></a>
    </div>
    <div style="font-weight: normal;">
        <div class="pContent">

            <div class="pContent" style="margin-top: 20px">
                <div class="pDetailContent" style="">
                    <div class="leftTile" style="">申请人名称： </div>
                    <div class="leftInput" style="height: 42px;">
                        <input id="username1" class="class-companyInfo asterisk" type="text" placeholder="请输入" style="width: 727px;float: left;" /><span style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;*</span>
                    </div>
                </div>
            </div>
            <div class="pContent">
                <div class="pDetailContent" style="">
                    <div class="leftTile" style="">手机号码： </div>
                    <div class="leftInput" style="height: 42px;">
                        <input id="staffname1" class="class-companyInfo asterisk" type="text" placeholder="请输入" style="width: 727px;float: left;" /><span style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;*</span>
                    </div>
                </div>
            </div>
            <div class="pContent">
                <div class="pDetailContent" style="">
                    <div class="leftTile" style="">身份证号： </div>
                    <div class="leftInput" style="height: 42px;">
                        <input id="staffname2" class="class-companyInfo asterisk" type="text" placeholder="请输入" style="width: 727px;float: left;" /><span style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;*</span>
                    </div>
                </div>
            </div>

            <div class="pContent">
                <div class="pDetailContent" style="">
                    <div class="leftTile" style="">申请单位： </div>
                    <div class="leftInput" style="height: 42px;">
                        <input id="staffname3" class="class-companyInfo asterisk" type="text" placeholder="请输入" style="width: 727px;float: left;" /><span style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;*</span>
                    </div>
                </div>
            </div>

            <div class="pContent">
                <div class="pDetailContent" style="">
                    <div class="leftTile" style="">机构代码或统一社会信用代码： </div>
                    <div class="leftInput" style="height: 42px;">
                        <input id="staffname5" class="class-companyInfo asterisk" type="text" placeholder="请输入" style="width: 727px;float: left;" /><span style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;*</span>
                    </div>
                </div>
            </div>

            <div class="pContent">
                <div class="pDetailContent" style="">
                    <div id="hh" class="leftTile" style="">申请原因： </div>
                    <div  class="leftInput" style="height: 42px;">
                        <input  id="staffname6" class="class-companyInfo asterisk " type="text" placeholder="请输入" style="width: 727px;float: left;" /><span style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;*</span>
                    </div>
                </div>
            </div>

        <%--    <div class="pDetailContent" id="areaSelect" style="display: none">
                <div class="left">
                    <div class="leftTile" style="">区域选择：</div>
                    <div class="leftInput" style="">
                        <select id="PROVINCE_CODE" class="class-companyInfo " style="">
                            <option value="430000">湖南省</option>
                        </select>
                        <select id="CITY_CODE" class="class-companyInfo " style="margin-left: 18px;"></select>
                        <select id="AREA_CODE" class="class-companyInfo asterisk" style="margin-left: 18px;"><option>请选择</option></select><font style="height: 30px;line-height: 30px;color: red;font-weight: bold;">&nbsp;&nbsp;*</font>
                    </div>
                </div>
            </div>--%>
            <!--<div class="pDetailContent" style="">
                <div class="left">
                    <div class="leftTile" style="">是否园区用户：</div>
                    <div class="leftInput" style="">
                        <select id="PARK_USER" class="class-companyInfo asterisk" style="">
                            <option value="Y">是</option>
                            <option value="N" selected>否</option>
                        </select>
                    </div>
                </div>
            </div>-->
        </div>
        <div class="row1" style="border-top: 1px solid #f4f4f5;margin-top: 20px;padding-top: 10px;color:#333333;text-align: center;">
            <div style="width: 100%;height: 30px;line-height: 30px;">
                <input id="saveButton" type="button" value="保存" onclick="saveButtonC(this)" style="background-color:#ffa524;border:1px solid #e5e5e5;border-radius:4px;height:30px;width:99px;font-size: 15px;" />
                <input id="subCancel1" type="button" class="sub_btn" value="取消" style="background-color:#ffa524;border:1px solid #e5e5e5;border-radius:4px;height:30px;width:99px;font-size: 15px;margin-left: 20px;"/>
            </div>
        </div>
    </div>
</div>


<section class="content" id="companyinfo-manage">
    <span style="font-weight: bold; color: #333;font-size: 23px;">查询区</span>
    <div class="content-div">
        <table width="100%">
            <tr>
                <td>
                    <div class="box_div" style="margin-left: 10px;">
                        <label class="c_title">资源名称：</label>
                        <input type="text" id="ziyusername" class="companyName-Input" />
                    </div>
                </td>
                <td>
                    <div class="box_div" style="margin-left: 30px;"  >
                        <label class="c_title">共享属性：</label>
                        <select class="class-item" style="width: 197px;" id="shared_attributes">
                            <option value="">请选择</option>
                            <option value="1">开放</option>
                            <option value="2">有条件共享</option>
                        </select>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
                    <div class="box_div" style="margin-left: 10px;" id = "town_searched" >
                        <label class="c_title">更新频率：</label>
                        <select class="class-item" style="width: 197px;" id="update_frequency">
                            <option value="">请选择</option>
                            <option value="1">周</option>
                            <option value="2">月</option>
                            <option value="3">季度</option>
                            <option value="4">半年</option>
                            <option value="5">年</option>
                        </select>
                    </div>
                </td>
            <td>
                <div class="box_div" style="margin-left: 10px;">
                    <label class="c_title"> &nbsp;&nbsp;&nbsp;资源描述：</label>
                    <input type="text" id="username5" class="companyName-Input" />
                </div>
            </td>
            </tr>
        </table>


    </div>

    <div class="content-div newCompanyUser-div">
        <div style="float:left">
            <span style="font-weight: bold; color: #333;font-size: 23px;">列表区</span>
        </div>
      <%--  <div class="list_button" style="background-color: rgba(22, 155, 213, 1);" >
            <div    style="margin: 5px;">
                <p><span onclick="updateButton()">资源申请</span></p>
            </div>
        </div>--%>
    </div>
    <div class="content-div" style="padding: 0px;">
        <div id="progressData">
            <table class="table table-striped2 table-hover" id="dataTable">
                <thead>
                <tr>
                    <th>产业名称</th>
                    <th>产业类型</th>
                    <th>共享属性</th>
                    <th>更新频率</th>
                    <th>访问量</th>
                    <th>申请量</th>
                    <th>更新时间</th>
                    <th>资源描述</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody id="processList" style="text-align: center;">
                <tr>
                    <td></td>
                    <%--<td colspan = '10'><img alt="" src="${ctx}/static/frame/img/ajax-loading.gif" style="margin-top: 30px;margin-bottom: 30px;  ">正在查询，请稍候...</td>--%>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="clearfix" id="page_div">
            <div style="float: left;padding-top: 24px;padding-left: 6%;font-size: 16px;">共计：
                <span style="color:#287cd9;" id="totalPage">0</span>&nbsp;条记录
            </div>
            <nav style="height:80px;" id="paging">
                <ul class="pager " style="text-align:left;margin-top:20px;margin-left:30%;">
                </ul>
            </nav>
        </div>
    </div>
    </tr>

</section>
<script>
   /* var data = (${data});
    console.log(data);
    var page = 1 ;*/
    // console.log(data.size);
    // var sysUserList = data.sysUserRole;
 $(document).ready(function () {
     searchData()
 })


    $("#ziyusername").blur(function(){
        /*alert("123")*/
        searchData()
    })
    $("#username5").blur(function(){
        searchData()
    })
    $("#shared_attributes").blur(function(){
        searchData()
    })
    $("#update_frequency").blur(function(){
        searchData()
    })

    function searchData(){
        var ziyusername = $("#ziyusername").val();
        var username5 = $("#username5").val();
        /* var ID = $("#org_select").val();
         var Text = $("#org_select option:eq(" + (parseInt(ID) - 1) + ")").text();
         alert(Text);*/
        /*var itemText1 = $("#ddl").find("option:selected").text();*/
        var cityname=$("#shared_attributes").find("option:selected").val();
        var areaname=$("#update_frequency").find("option:selected").val();
        var pageCount = 10;
        var dataType1 = "1";
        var count = 0;
        $.ajax({
            <%--url:"${ctx}/adminUserManage/dataSupplement1",--%>
            url:"${ctx}/dataResourcesInfo/selectList",
            data:{
                username:ziyusername, /*资源名称*/
                cityname:cityname, /*共享属性*/
                areaname:areaname, /*更新频率*/
                username5:username5,
                dataType:dataType1,  //数据类型
                pageCount : pageCount ,
                page:1
            },
            type:"post",
            dataType: "json",
            async: true,
            success: function (data) {
                if(data){
                    //console.log(data);
                    // var data = eval("(" + data.result + ")");
                    var data =  data.dataResourceInfoMVOS ;
                    var resultList = data.rows;

                    if (null != resultList && resultList.length > 0) {
                        count = data.total;
                        $("#totalPage").text(count);
                        setTableData(resultList);
                    } else {
                        $("#totalPage").text('0');
                        $("#processList").empty();
                    }
                    $("#paging .pager").unbind("click");
                    $("#paging .pager").createPage({
                        totalPage:Math.ceil(count/pageCount),
                        currPage:1,
                        backFn:function(p){
                            $.ajax({
                                url:"${ctx}/dataResourcesInfo/selectList",
                                data:{
                                    username:ziyusername, /*资源名称*/
                                    cityname:cityname, /*共享属性*/
                                    areaname:areaname, /*更新频率*/
                                    username5:username5,
                                    pageCount : pageCount ,
                                    page:p
                                },
                                type:"post",
                                dataType: "json",
                                async: false,
                                success: function (data) {
                                    if(data) {
                                        if(null !== data.dataResourceInfoMVOS || "" == data.dataResourceInfoMVOS) {
                                            var data =  data.dataResourceInfoMVOS ;
                                            var resultList = data.rows;
                                            if (null != resultList && resultList.length > 0) {
                                                count = data.total;
                                                $("#totalPage").text(count);
                                                setTableData(resultList);
                                            } else {
                                                $("#totalPage").text('0');
                                                $("#processList").empty();
                                            }
                                        }else{
                                            window.top.swal({
                                                title: "抱歉，显示失败！",
                                                text: data.message,
                                                type: "error",
                                                closeOnConfirm: true,
                                                confirmButtonText: "确定"
                                            }, function () {
                                            });
                                        }
                                    }
                                }
                            });
                        }
                    });

                }else{
                    window.top.swal({
                        title: "抱歉，显示失败！",
                        text: data.message,
                        type: "error",
                        closeOnConfirm: true,
                        confirmButtonText: "确定"
                    }, function () {
                    });
                }

            }
        });
    }

    function setTableData(list){
        $("#dataTable thead").empty();
        var contentHead = [];
        var trData = "<tr>";
        trData +="<th>序号</th>";
        trData += "<th>资源名称</th>";
        trData += "<th>资源类型</th>";
        trData += "<th>共享属性</th>";
        trData += "<th>更新频率</th>";
        trData += "<th>访问量</th>";
        trData += "<th>申请量</th>";
        trData += "<th>更新时间</th>";
        trData += "<th>资源描述</th>";
        trData += "<th>操作</th>";
        trData += "</tr>";
        contentHead.push(trData);
        $("#dataTable thead").html(contentHead.join(''));

        var totalNum = list.length;
       /* var index= (page-1)*10+1;*/
        var index= 1;
        var arr = [] ;

        if(totalNum > 0){
            for(var i = 0;i < totalNum;i++){
                var str = "<tr>";
                /*str += "<td><input type='checkbox' value='"+list[i].resourceId+"'></td>"*/
                str += "<td  title='"+(index+i)+"'>"+(index+i)+"</td >";
                if(list[i].resourceName){
                    str += "<td  title='"+list[i].resourceName+"'>" +list[i].resourceName+"</td >";
                }else{
                    str += "<td></td>";
                }

                if(list[i].resourceType){
                    str +=  "<td  title='"+list[i].resourceType+"'>";
                    if(list[i].resourceType=='1'){
                        str += '产业数据';
                    }else if(list[i].resourceType == '2'){
                        str += '外部数据';
                    }
                    str += "</td >";
                }else{
                    str += "<td></td>";
                }

                if(list[i].sharedAttributes){
                    str +=  "<td  title='"+list[i].sharedAttributes+"'>";
                    if(list[i].sharedAttributes=='1'){
                        str += '开放';
                    }else if(list[i].sharedAttributes == '2'){
                        str += '有条件共享';
                    }
                    str += "</td >";
                }else{
                    str += "<td></td>";
                }
                if(list[i].updateFrequency){
                    str += "<td  title='"+list[i].updateFrequency+"'>" ;
                    switch (list[i].updateFrequency) {
                        case "1":   str += '周';
                            break;
                        case "2":   str += '月';
                            break;
                        case "3":   str += '季度';
                            break;
                        case "4":   str += '半年';
                            break;
                        case "5":   str += '年';
                            break;
                        default:
                            break;
                    }
                    str += "</td >";
                }else{
                    str +=  "<td></td>";
                }

                if(list[i].pvvolume){
                    str += "<td title='"+list[i].pvvolume+"'>"+list[i].pvvolume+"</td>";

                }else{
                    str += "<td></td>";
                }

                if(list[i].quantity){
                    str += "<td title='"+list[i].quantity+"'>"+list[i].quantity+"</td>";
                }else{
                    str += "<td></td>";
                }

                if(list[i].updateTime){
                    str += "<td title='"+list[i].updateTime+"'>"+list[i].updateTime+"</td>";
                }else{
                    str += "<td></td>";
                }

                if(list[i].resourceDescription){
                    var arr11  = list[i].resourceDescription
                    if (arr11.length>8){
                        var split = arr11.substring(0,6);
                       // alert(split)
                        str += "<td title='"+split+"'>"+split+'……'+"</td>";
                    }else {
                        str += "<td title='"+list[i].resourceDescription+"'>"+list[i].resourceDescription+"</td>";
                    }
                }else{
                    str += "<td></td>";
                }
                if(list[i].resourceId){
                    var  resourceId = list[i].resourceId
                   /* alert(resourceId)*/
                    str += "<td " +
                        '<div class="list_button" style="background-color: rgba(22, 155, 213, 1);" >\n' +
                        '                            <div    style="margin: -10px;">\n' +
                        '                               <span onclick="updateButton1('+resourceId+')">详情</span>\n' +
                        '                            </div>\n' +
                        '                        </div>'
                        "</td>";
                }else{
                    str += "<td></td>";
                }


                str += "</tr>";
                arr.push(str) ;
            }
        }
        $("#processList").empty();
        $("#processList").html(arr.join(''));
    }

    function saveButtonC() {
        //必填校验
        var username1 =   $('#username1').val();
        if(username1=="" || $.trim(username1) == ""){
            saveFlag = 'error';
            window.top.swal({
                title: "申请人名称不能为空",
//                text: data.message,
                type: "warning",
                closeOnConfirm: true,
                confirmButtonText: "确定"
            });
            return;
        }

        var staffname1 =   $('#staffname1').val();
        if(staffname1=="" || $.trim(staffname1) == ""){
            saveFlag = 'error';
            window.top.swal({
                title: "手机号码不能为空",
//                text: data.message,
                type: "warning",
                closeOnConfirm: true,
                confirmButtonText: "确定"
            });
            return;
        }

        var staffname2 =   $('#staffname2').val();
        if(staffname2=="" || $.trim(staffname2) == ""){
            saveFlag = 'error';
            window.top.swal({
                title: "身份证号不能为空",
//                text: data.message,
                type: "warning",
                closeOnConfirm: true,
                confirmButtonText: "确定"
            });
            return;
        }


        /*var provineeCode =$('#PROVINCE_CODE').val();
        var parkId = $('#HN_PARK_ID').val();
        var cityCode = $('#CITY_CODE').val();
        var areaCode = $('#AREA_CODE').val();
        var BIZ_MODULE = $('#BIZ_MODULE').attr('name');
        var userType=$('#USER_TYPE').val()*/
  /*
        if( cityCode == ''&& areaCode == '' && userType !='province'){
            saveFlag = 'error';
            window.top.swal({
                title: "请选择地区",
//                text: data.message,
                type: "warning",
                closeOnConfirm: true,
                confirmButtonText: "确定"
            });
            return;
        }
        var role=$("#role").val()
        if(role=="" || $.trim(role) == ""){
            saveFlag = 'error';
            window.top.swal({
                title: "请选择角色",
//                text: data.message,
                type: "warning",
                closeOnConfirm: true,
                confirmButtonText: "确定"
            });
            return;
        }*/

/*        申请人名称  username1 手机号码 staffname1  身份证号 staffname2 申请单位 staffname3 机构代码或统一社会信用代码 staffname5 申请原因 staffname6*/
        //var addtype = $("#addtype").val();
     /*   var cityname=$("#CITY_CODE").find("option:selected").text()
        var areaname=$("#AREA_CODE").find("option:selected").text()
        var orgid=$("#org_select").val()
        var rolename=$("#role").find("option:selected").text()
        var sysuserid=$("#sysUserId").val()
        var staffId=$("#staffId").val()
        var sysUserRoleId=$("#sysUserRoleId").val()*/
        var staffname3=$("#staffname3").val()
        var staffname5=$("#staffname5").val()
        var staffname6=$("#staffname6").val()
        $.ajax({
            url:"${ctx}/dataResourceApply/insertapply",
            data: {
                username1:username1,
                staffname1:staffname1,
                staffname2:staffname2,
                staffname3:staffname3,
                staffname5:staffname5,
                staffname6:staffname6
            },
            type:"post",
            async: true,
            dataType:"json",
            success:function(data) {
             //   console.log(data.result)
               /* var data = eval("(" + data.result + ")");
                alert(data)*/
                if (data.result=='保存成功') {
                    saveFlag = 'save';
                    window.top.swal({
                        title: data.result1,
                        //text: data.message,
                        type: "success",
                        closeOnConfirm: true,
                        confirmButtonText: "确定"
                    },function () {
                        $("#closeBtn1").click();
                        //searchData();
                        window.location.reload()
                    });
                }else if (data.result=='插入失败') {
                    window.top.swal({
                        title: data.result1,
                        //text: data.message,
                        type: "warning",
                        closeOnConfirm: true,
                        confirmButtonText: "确定"
                    });
                }else if (data.result=='不能输入为空') {
                    window.top.swal({
                        title: data.result,
                        //text: data.message,
                        type: "warning",
                        closeOnConfirm: true,
                        confirmButtonText: "确定"
                    });
                }
            }
        });

    }

    $("#username").blur(function(){
        loading()
        searchData()
    })
    $("#staffname").blur(function(){
        loading()
        searchData()
    })

    //初始化行业下拉框
    /*function initIndustrySelect(IndutryList){
        var contentHtml = [];
        contentHtml.push("<option value=''>请选择</option>");
        for (var i = 0;i<IndutryList.length;i++) {
            contentHtml.push("<option value='"+IndutryList[i].INDUSTRY_CATEGORY_ID+"'>"+IndutryList[i].CATEGORT_NAME+"</option>");
        }
        $("#BIZ_MODULE").empty();
       $("#BIZ_MODULE").html(contentHtml.join(''));
    }*/

    //初始化市区下拉框
    function initCitySelect(cityList){
        var contentHtml = [];
        if(cityList.length > 0) {
            if (cityList.length > 1) {
                contentHtml.push("<option value=''>请选择</option>");
            }
            for (var i = 0; i < cityList.length; i++) {
                contentHtml.push("<option value='" + cityList[i].AREA_ID + "'>" + cityList[i].NAME + "</option>");
            }
        }else{
            contentHtml.push("<option value=''>请选择</option>");
        }

        $("#area_selected").empty();
        $("#area_selected").html(contentHtml.join(''));
        $("#CITY_CODE").empty();
        $("#CITY_CODE").html(contentHtml.join(''));
        $("#HN_PARK_AREA").empty();
        $("#HN_PARK_AREA").html(contentHtml.join(''));
    }
    //初始化县级下拉框
    function initAreaSelect(areaList){
        var contentHtml = [];
        if(areaList.length > 0){
            if(areaList.length > 1){
                contentHtml.push("<option value=''>请选择</option>");
            }
            for(var i = 0, l = areaList.length; i < l ; i++) {
                contentHtml.push("<option value='" + areaList[i].AREA_ID + "'>" + areaList[i].NAME + "</option>");
            }

        }else{
            contentHtml.push("<option value=''>请选择</option>");
        }


        $("#town_selected").empty();
        $("#town_selected").html(contentHtml.join(''));
    }
    //初始化县级下拉框
    function initAreaSelect1(areaList){
        var contentHtml = [];
        if(areaList.length > 0){
            if(areaList.length > 1){
                contentHtml.push("<option value=''>请选择</option>");
            }
            for(var i = 0, l = areaList.length; i < l ; i++) {
                contentHtml.push("<option value='" + areaList[i].AREA_ID + "'>" + areaList[i].NAME + "</option>");
            }

        }else{
            contentHtml.push("<option value=''>请选择</option>");
        }
        $("#AREA_CODE").empty();
        $("#AREA_CODE").html(contentHtml.join(''));
    }



    $("#town_selected").change(function(){
        loading();
        searchData();
    });

    $("#USER_TYPE").change(function () {
        if($("#USER_TYPE").val()=='province'){
            provincebox()
        }else if ($("#USER_TYPE").val()=='city'){
            citybox()
        }else if($("#USER_TYPE").val()=='county'){
            countybox()
        }else if($("#USER_TYPE").val()=='park'){
            parkbox()
        }

    })
    function citybox(){
        $("#areaSelect").show()
        $("#PARK_SELECT").hide()
        $("#AREA_CODE").hide()
        $("#org_select_div").hide()
        $("#industryselect").hide()
    }
    function parkbox(){
        $("#areaSelect").show()
        $("#PARK_SELECT").show()
        $("#AREA_CODE").hide()
        $("#org_select_div").hide()
        $("#industryselect").hide()
    }
    function countybox(){
        $("#areaSelect").show()
        $("#PARK_SELECT").hide()
        $("#AREA_CODE").show()
        $("#org_select_div").hide()
        $("#industryselect").hide()
    }
    function provincebox(){
        $("#areaSelect").hide()
        $("#PARK_SELECT").hide()
        $("#org_select_div").show()
        $("#industryselect").hide()
    }




    //初始化园区下拉框
    function initParkSelect(parkList){
        var contentHtml = [];

        if(parkList.length > 0) {
            contentHtml.push("<option value=''>请选择</option>");
            for (var i = 0;i<parkList.length;i++) {
                contentHtml.push("<option value='"+parkList[i].parkId+"'>"+parkList[i].name+"</option>");
            }
        }else{
            contentHtml.push("<option value=''>请选择</option>");
        }
        $("#HN_PARK_ID").empty();
        $("#HN_PARK_ID").html(contentHtml.join(''));
    }

    //初始化角色下拉
    function initRoleSelect(roleList) {
        var contentHtml = [];

        if(roleList.length > 0) {
            contentHtml.push("<option value=''>请选择</option>");
            for (var i = 0;i<roleList.length;i++) {
                contentHtml.push("<option value='"+roleList[i].roleId+"'>"+roleList[i].roleName+"</option>");
            }
        }else{
            contentHtml.push("<option value=''>请选择</option>");
        }
        $("#role").empty();
        $("#role").html(contentHtml.join(''));

    }

    //初始化处室下拉
    function initOfficeListSelect(officeList) {
        var contentHtml = [];

        if(officeList.length > 0) {
            contentHtml.push("<option value=''>请选择</option>");
            for (var i = 0;i<officeList.length;i++) {
                contentHtml.push("<option value='"+officeList[i].orgId+"'>"+officeList[i].name+"</option>");
            }
        }else{
            contentHtml.push("<option value=''>请选择</option>");
        }
        $("#org_select").empty();
        $("#org_select").html(contentHtml.join(''));

    }

    // 初始化行业
    function initIndustrySelect(IndutryList){
        var contentHtml = [];
        contentHtml.push('<input type="checkbox" id="boxid" value="&nbsp;&nbsp;全部&nbsp;&nbsp;" onclick="swapCheck()" />全部');
        contentHtml.push('<br>');
        for (var i = 0;i<IndutryList.length;i++) {
            if(i%2 == 0){
                contentHtml.push('<input type="checkbox" value="'+IndutryList[i].INDUSTRY_CATEGORY_ID+'" name="sProblem" id = "'+IndutryList[i].CATEGORT_NAME+'">'+IndutryList[i].CATEGORT_NAME);
                contentHtml.push('&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;');
            }else{
                contentHtml.push('<input type="checkbox" value="'+IndutryList[i].INDUSTRY_CATEGORY_ID+'" name="sProblem" id = "'+IndutryList[i].CATEGORT_NAME+'">'+IndutryList[i].CATEGORT_NAME);
                contentHtml.push('<br>');
            }
        }
        $("#companyIndustryId").empty();
        $("#companyIndustryId").html(contentHtml.join(''));
    }
    // 复选框弹窗
    function showIndustryIdWindow() {
        /*var _top = window.parent.document.documentElement.scrollTop ;
        $("#industryIdShowdiv").css("top",_top+100+"px");*/
        $('#industryIdShowdiv').show();  //显示弹窗
    }
    //复选框查询关闭
    function closeIndustryIdWindow(){
        var test = $("input[name='sProblem']:checked");
        var checkBoxValue = "";
        var checkBoxValue2 = "";
        for(var i = 0;i<test.length;i++){
            if(i==test.length-1){
                checkBoxValue += test[i].value;
                checkBoxValue2 += test[i].id;
            }else{
                checkBoxValue += test[i].value+",";
                checkBoxValue2 += test[i].id+",";
            }
        }
        var contentHtml = document.getElementById("BIZ_MODULE");
        /*if(checkBoxValue2 == "" || checkBoxValue2 == null){
            contentHtml.value = "全部";
            contentHtml.name = "";
        }else{*/
        contentHtml.value = checkBoxValue2;
        contentHtml.name = checkBoxValue;
        //}

        $('#industryIdShowdiv').hide(); //隐藏产业弹窗
    }
    //全部查询
    /*function setAllNo() {
        var loves = document.getElementsByName("sProblem");
        for (var i = 0; i < loves.length; i++) {
            loves[i].checked = false;
        }
    }*/
    var isCheckAll = false;
    function swapCheck() {
        if (isCheckAll) {
            $("input[type='checkbox']").each(function() {
                this.checked = false;
            });
            isCheckAll = false;
        } else {
            $("input[type='checkbox']").each(function() {
                this.checked = true;
            });
            isCheckAll = true;
        }
    }




    $("#closeBtn1").hover(function () {
        $(this).css({color: 'black'})
    }, function () {
        $(this).css({color: '#999'})
    }).on('click', function () {
        $("#LoginBox1").fadeOut("fast");
        $("#bg_1").css({display: 'none'});
        $('#industryIdShowdiv').hide();
    });
    $("#subCancel1").click(function(){
        $("#closeBtn1").click();
    });
    function addButton(){
        $("#bg_1").css({display:'block'});
        $("#LoginBox1").fadeIn("slow");
        $("#head").text("新增政府用户");
        $("#addtype").val("A");
        initBox();
    }




   function updateButton1(id){
       /* alert(id)*/
       //资源详情
       var url = "${ctx}/industry/dataresourceinfo/detail?resourceId="+id+"&type="+2;
       window.location.href = url;
   }

    //资源申请
    function updateButton(obj){
        initBox();
        $("#USER_TYPE").attr('disabled',true)
        //$("#role").attr('disabled',true)
        $("#industryselect").hide()
        $("#bg_1").css({display:'block'});
        $("#LoginBox1").fadeIn("slow");
        $("#head").text("资源申请");
    }



    timer = setInterval(function(){
        var menuFrame = $(window.parent.document).find("#menuFrame");
        var clientHeight = document.body.clientHeight;
        var height = 0;
        if (!$('#companyinfo-manage').is(':hidden')) {
            height = $("#companyinfo-manage").height();
//             console.log("section++++++++++++++businessManagement-areaAttachment+++" + height);
        }
        menuFrame.height(height + 250);
    },500);//每0.5秒检查一次

    //初始化弹框
    function initBox(){
        $('#username1').val('')
        $('#staffname1').val('')
        $('#HN_PARK_ID').val('');
        $('#CITY_CODE').val('');
        $('#AREA_CODE').val('');
        $('#BIZ_MODULE').val('');
        $('#USER_TYPE').val('province')
        $("#BIZ_MODULE").attr("name","")
        $('#role').val('')
        $('#org_select').val('')
        $('#sysUserId').val('')
        $('#orgId').val('')
        $('#sysUserRoleId').val('')
        $('#staffId').val('')
        $("#USER_TYPE").attr('disabled',false)
        $("#role").attr('disabled',false)
        $("input[type='checkbox']").each(function() {
            this.checked = false;
        });
        $("#areaSelect").hide()
        $("#PARK_SELECT").hide()
        $("#org_select_div").show()
        $("#industryselect").show()
        /* var data = (${data});
        var sysUserList = data.sysUserRole;
        if(data.parentList){
            initCitySelect(data.parentList);
        }
        if(data.areaList){
            initAreaSelect(data.areaList);
        }*/
    }

    function loading(){
        $("#dataTable tbody").empty();
        var loading = "<tr style='text-align: center;'><td colspan = '5'><img alt='' src='${ctx}/static/frame/img/ajax-loading.gif' style='margin-top: 30px;margin-bottom: 30px;'>正在查询，请稍候...</td></tr>";
        $("#dataTable tbody").html(loading);
    }
</script>

相关文章

网友评论

      本文标题：jq中的弹窗与范文(常见表格和按钮弹窗,ajax遍历)

      本文链接：https://www.haomeiwen.com/subject/pkwlyktx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|jq中的弹窗与范文(常见表格和按钮弹窗,ajax遍历)|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！