Make a dialog box with Jquery-ui Dialog

JS file:

<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>

Mask Layer Effect 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 Layer:

<Divstyle= "Display:none;"ID= "Addpotential"title= "Package Import">            <formAction=""ID= "Potentialform"Method= "POST">               <Divclass= "Arightbor">                    <Divclass= "Acontent">                         <Tablewidth= "100%"Align= "Center"cellpadding= "5"cellspacing= "0"style= "margin-top:15px;font-size:12px"ID= "Showcontact">                               <TR>                                <TDwidth= "+"Height= "+"Align= "Right" >Copy 4s store:</TD>                                <TDID= "Show4shop"></TD>                              </TR>                              <TR>                                <TDwidth= "+"Height= "+"Align= "Right" >Import 4s store:</TD>                                <TD>                                     <SelectID= "Insertselect"name= "Insertsid"style= "height:25px"onchange="">                                    <optionvalue= "0">--Please choose--</option>                                        </Select>                                          <DivID= "Datedivtwo"></Div>                               </TD>                              </TR>                            </Table>                                            </Div>                   </Div>             </form>      </Div>

Js:

$(function(){        $("#importmaintenance"). Click (function(){                    //execution of related business logic information$ ("#show4Shop"). HTML ($ ("#oldshop"). HTML ()); $.ajax ({type:"POST", URL:"<%=basepath%>shopmaintenanceaction_insertcarmaintenancelist", Datetype:"Text/html", Success:function(Result) {varMsg=eval ("(" +result+ ")"); $.each (MSG,function(Index,item) {$ ("#insertSelect"). Append ("<option value= '" +item[0]+ ">" +item[1]+ "</option>");                            }); varinsertselect=$ ("#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:{"OK":function(){                     $("#datedivTwo"). HTML (""); varinsertselect=$ ("#insertSelect"). Val (); if(insertselect==0){                          $("#datedivTwo"). HTML ("<font color= ' red ' > Please select import 4s store!</font>"); return ; }                          //execution of related business logic information$ ("#addPotential"). showloading (); $.ajax ({type:"POST", URL:"<%=basepath%>shopmaintenanceaction_copycarmaintenancelist", Datetype:"Text/html", data:$ ("#potentialForm"). Serialize (), Success:function(Result) {if(Result = = "1"){                                        $("#addPotential"). hideloading (); Mask Layer effect Alert ("Import succeeded"); Window.location.href= "Shopmaintenanceaction_getcarmaintenancelist"; }Else{                                        $("#addPotential"). hideloading (); Alert ("Import Failed");                     }                                }                        }); }                    ,                     "Cancel":function(){                         $( This). dialog ("Close");        }                 }            });  }); });

Make a dialog box with Jquery-ui Dialog