experiments/spclient/index-popup.html

   1 <html>
   2   <head>
   3     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4     <title>MKWS demo: popup search box</title>
   5
   6     <link rel="stylesheet" href="http://mkws.indexdata.com/mkwsStyle.css" />
   7     <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
   8
   9     <script type="text/javascript">
  10       mkws_config = {
  11         service_proxy_url : "/service-proxy/",
  12         service_proxy_auth : "/service-proxy-auth/",
  13         switch_menu: false,
  14         lang_menu: false,
  15         perpage_default: 10,
  16         query_width: 50
  17      };
  18     </script>
  19
  20     <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
  21     <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  22
  23     <script type="text/javascript" src="libjs-pz2/pz2api.1.js"></script>
  24     <script type="text/javascript" src="mkws.js"></script>
  25
  26     <style>
  27       body { font-size: 62.5%; }
  28       label, input { display:block; }
  29       input.text { margin-bottom:12px; width:95%; padding: .4em; }
  30       fieldset { padding:0; border:0; margin-top:25px; }
  31       h1 { font-size: 1.2em; margin: .6em 0; }
  32       div#users-contain { width: 350px; margin: 20px 0; }
  33       div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
  34       div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
  35       .ui-dialog .ui-state-error { padding: .3em; }
  36       .validateTips { border: 1px solid transparent; padding: 0.3em; }
  37     </style>
  38
  39     <script>
  40     $(function() {
  41       $( "#dialog-form" ).dialog({
  42         closeOnEscape: true,
  43         autoOpen: false,
  44         height: 760,
  45         width: 880,
  46         modal: true,
  47         resizable: true,
  48         buttons: {
  49                 Cancel: function() {
  50                         $( this ).dialog( "close" );
  51                 }
  52         },
  53         close: function() {
  54                 // allFields.val( "" ).removeClass( "ui-state-error" );
  55         }
  56       });
  57
  58       $( "#create-user" )
  59         .button()
  60         .click(function() {
  61                 $( "#dialog-form" ).dialog( "open" );
  62         });
  63     });
  64     </script>
  65   </head>
  66   <body>
  67
  68   <div id="dialog-form" title="Search Box">
  69     <script type="text/javascript">
  70       jQuery.pazpar2({ "layout":"div"} );
  71     </script>
  72   </div>
  73
  74   <div id="users-contain" class="ui-widget"></div>
  75
  76   <button id="create-user">Open Search Box</button>
  77
  78   </body>
  79 </html>