用jquery-ui的dialog做对话框

Posted 2020-07-31

js文件:

<script src="plugins/jqueryui/jqueryui/jquery-1.9.1.js" type="text/javascript"></script>
<link rel="stylesheet" href="plugins/jqueryui/themes/base/jquery.ui.all.css"/>
<script src="plugins/jqueryui/jqueryui/jquery-ui.js" type="text/javascript"></script>

 

// 遮罩层特效js

<link href="plugins/showLoading/showLoading.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="plugins/showLoading/jquery.showLoading.min.js"></script>  

 

div层:

<div style="display: none;" id="addPotential" title="套餐导入">
            <form action=""  id="potentialForm" method="post">
               <div class="Arightbor">
                    <div class="Acontent">
                         <table width="100%" align="center" cellpadding="5" cellspacing="0" style="margin-top:15px;font-size: 12px" id="showcontact">
                               <tr>
                                <td width="100" height="30" align="right" >复制4s店：</td>
                                <td id="show4Shop"></td>
                              </tr>
                              <tr>
                                <td width="100" height="30" align="right" >导入4s店：</td>
                                <td > 
                                    <select id="insertSelect" name="insertsid" style="height:25px" onchange="">
                                    <option value="0">--请选择--</option>
                                        </select>
                                          <div id="datedivTwo"></div>
                               </td>
                              </tr>
                            </table>                        
                    </div>
                   </div>
             </form> 
     </div>

 

 js:

$(function(){
        $("#importmaintenance").click(function(){        
            //执行相关的业务逻辑信息
            $("#show4Shop").html($("#oldshop").html());
            $.ajax({
                     type:"POST",
                    url:"<%=basePath%>shopMaintenanceAction_InsertCarMaintenanceList",
                    dateType:"text/html",
                    success:function(result){
                     var msg=eval("("+result+")");
                        $.each(msg,function(index,item){
                            $("#insertSelect").append("<option value=‘"+item[0]+"‘>"+item[1]+"</option>");
                        });    
                        var insertSelect=$("#insertSelect").val();
                        $("#insertSelect").combobox({
                             onChange:function(insertSelect){
                                 if(!isNaN(insertSelect)){
                                 if(insertSelect!=0 && insertSelect!=""){
                                   $("#insertSelect").find("option[‘"+insertSelect+"‘]").attr("selected",true);
                                 }
                                 }
                                  
                             }
                        });
                    }
            });
                                    
            $("#addPotential").dialog({
                 resizable: false,
                 height:300,
                 width:350,
                 modal: true,
                   buttons:{                         
                    "确定": function(){
                     $("#datedivTwo").html("");                
                      var insertSelect=$("#insertSelect").val();
                      if(insertSelect==0){
                          $("#datedivTwo").html("<font color=‘red‘>请选择导入4s店!</font>");
                           return ;
                      }
                          //执行相关的业务逻辑信息
                        $("#addPotential").showLoading(); 
                          $.ajax({
                                 type:"POST",
                                url:"<%=basePath%>shopMaintenanceAction_copyCarMaintenanceList",
                                dateType:"text/html",
                                data:$("#potentialForm").serialize(),
                                success:function(result){
                                    if(result == "1"){
                                        $("#addPotential").hideLoading();  //遮罩层特效
                                        alert("导入成功");
                                        window.location.href="shopMaintenanceAction_getCarMaintenanceList";
                                    }else{
                                        $("#addPotential").hideLoading();
                                        alert("导入失败 ");
                                    }
                                }
                        });
                     }
                    ,
                     "取消": function(){
                         $(this).dialog("close");
                     }
                 }
            });
        });
  });