SHARE
TWEET

Java

a guest Oct 31st, 2017 159 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.   <meta charset="utf-8">
  6.   <meta name="viewport" content="width=device-width, initial-scale=1">
  7.     <!-- Bootstrap core CSS -->
  8.     <link href="vendor/bootstrap/css/bootstrap.css" rel="stylesheet">
  9.  
  10.     <!-- Custom styles for this template -->
  11.     <link href="css/logo-nav.css" rel="stylesheet">
  12.    
  13.      <link href='jquery-ui.min.css' type='text/css' rel='stylesheet' >
  14.     <script src="jquery-3.2.1.min.js" type="text/javascript"></script>
  15.     <script src="jquery-ui.min.js" type="text/javascript"></script>
  16.  
  17.     <script type="text/javascript">
  18.         $(document).ready(function(){
  19.  
  20.             $(document).on('keydown', '.username', function() {
  21.                
  22.                 var id = this.id;
  23.                 var splitid = id.split('_');
  24.                 var index = splitid[1];
  25.  
  26.                 $( '#'+id ).autocomplete({
  27.                     source: function( request, response ) {
  28.                         $.ajax({
  29.                             url: "getDetails.php",
  30.                             type: 'post',
  31.                             dataType: "json",
  32.                             data: {
  33.                                 search: request.term,request:1
  34.                             },
  35.                             success: function( data ) {
  36.                                 response( data );
  37.                             }
  38.                         });
  39.                     },
  40.                     select: function (event, ui) {
  41.                         $(this).val(ui.item.label); // display the selected text
  42.                         var userid = ui.item.value; // selected id to input
  43.  
  44.                         // AJAX
  45.                         $.ajax({
  46.                             url: 'getDetails.php',
  47.                             type: 'post',
  48.                             data: {userid:userid,request:2},
  49.                             dataType: 'json',
  50.                             success:function(response){
  51.                                
  52.                                 var len = response.length;
  53.  
  54.                                 if(len > 0){
  55.                                     var id = response[0]['id'];
  56.                                     var name = response[0]['name'];
  57.                                     var email = response[0]['email'];
  58.                                     var age = response[0]['age'];
  59.                                     var salary = response[0]['salary'];
  60.  
  61.                                     document.getElementById('name_1'+index).value = name;
  62.                                     document.getElementById('age_'+index).value = age;
  63.                                     document.getElementById('email_'+index).value = email;
  64.                                     document.getElementById('salary_'+index).value = salary;
  65.                                    
  66.                                 }
  67.                                
  68.                             }
  69.                         });
  70.  
  71.                         return false;
  72.                     }
  73.                 });
  74.             });
  75.            
  76.            
  77.         });
  78.  
  79.     </script>
  80. </head>
  81. <body>
  82.  
  83.     <div class="container">
  84.     <nav class="navbar navbar-default" style="
  85.     background-color: #afafaf; ">
  86.   <div class="container-fluid">
  87.     <div class="navbar-header">
  88.       <a class="navbar-brand" href="#">
  89.      
  90.       </a>
  91.     </div>
  92.   </div>
  93. </nav>
  94.           <div class="row">
  95.        
  96.             <div class="col-10"style="
  97.     background-color: #d2d2d2; padding: 0;">
  98.     <form name="catwebformform43575">
  99.     <ol class="breadcrumb" style="
  100.     padding: 0;">
  101.   <li>
  102.       <center style="
  103.     background-color: #3a4692;"><font color="white">        Vrijgeven/etiketteren ( ctpetiqt_d )</font> </center>
  104.     </li>
  105.     </ol>
  106.     <!-- Inputy -->
  107.      <div class="row">
  108.      <div class="col-12" >
  109.      </br></br></br></br>
  110.      </div>
  111.           <div class="col-7"  style="padding: 5px;
  112.           border:1px solid #929292;
  113.           -webkit-box-shadow:0px 0px 1px 1px #929292 ;
  114. -moz-box-shadow:0px 0px 1px 1px #929292 ;
  115. box-shadow:0px 0px 1px 1px #929292 ;">
  116.  
  117.  
  118.         <div class="input-group">
  119.         <span class="input-group-addon" id="basic-addon1">Vrij te geven prod</span>
  120.         <div class='tr_input'>
  121.         <input type="text" id="Vrijtegevenprod"  class='username' id='username_1' placeholder="" aria-describedby="basic-addon1" style="
  122.     max-width: 200px; background-color: #ffffcc;
  123. ">
  124. </div>
  125.  
  126.         </div>
  127.         </br></br></br></br>
  128.         </div>
  129.           <div class="col-3">
  130.         Bloedgroep
  131.         </div>
  132.         <div class="col-7" style="padding: 5px;
  133.           border:1px solid #929292;
  134.           -webkit-box-shadow:0px 0px 1px 1px #929292 ;
  135. -moz-box-shadow:0px 0px 1px 1px #929292 ;
  136. box-shadow:0px 0px 1px 1px #929292 ;">
  137.  
  138.  
  139.  
  140.         <div class="input-group">
  141.         <div class="col-3">
  142.         <span class="input-group-addon" id="basic-addon1">Origineel EIN</span>
  143.         </div>
  144.         <div class="col-9">
  145.         <input type="text" id="OrigineelEIN" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  146.     width: 300px;
  147. ">
  148.         </div>
  149.         </div>
  150.         </br>
  151.        
  152.         <div class="input-group">
  153.         <div class="col-3">
  154.         <span class="input-group-addon" id="basic-addon1">Afgenomen op</span>
  155.         </div>
  156.         <div class="col-9">
  157.         <div class='tr_input'>
  158.         <input type="text"  class='name' id='name_1' placeholder="" aria-describedby="basic-addon1" style="
  159.     width: 200px;
  160. ">
  161. </div>
  162.         </div>
  163.         </div>
  164.        
  165.        
  166.         <div class="input-group">
  167.         <div class="col-3">
  168.         <span class="input-group-addon" id="basic-addon1">Exp. datum</span>
  169.         </div>
  170.         <div class="col-9">
  171.         <div class='tr_input'>
  172.         <input type="text" class='age' id='age_1' placeholder="" aria-describedby="basic-addon1" style="
  173.     width: 330px;
  174. ">
  175. </div>
  176.         </div>
  177.         </div>
  178.    
  179.        
  180.         <div class="input-group">
  181.         <div class="col-3">
  182.         <span class="input-group-addon" id="basic-addon1">Fenotype</span>
  183.         </div>
  184.         <div class="col-9">
  185.         <div class='tr_input'>
  186.         <input type="text" class='email' id='email_1' placeholder="" aria-describedby="basic-addon1" style="
  187.     width: 450px;
  188. ">
  189. </div>
  190.         </div>
  191.         </div>
  192.        
  193.        
  194.         <div class="input-group">
  195.         <div class="col-3">
  196.         <span class="input-group-addon" id="basic-addon1">Kenmerken</span>
  197.         </div>
  198.         <div class="col-9">
  199.         <input type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  200.     width: 450px;
  201. ">
  202.         </div>
  203.         </div>
  204.        
  205.        
  206.         <div class="input-group">
  207.         <div class="col-3">
  208.         <span class="input-group-addon" id="basic-addon1">Productcode</span>
  209.         </div>
  210.         <div class="col-9">
  211.         <input type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  212.    width: 200px;
  213. ">
  214.         </div>
  215.         </div>
  216.        
  217.        
  218.         <div class="input-group">
  219.         <div class="col-3">
  220.         <span class="input-group-addon" id="basic-addon1">Bloedgroepcode</span>
  221.         </div>
  222.         <div class="col-9">
  223.         <input type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  224.     width: 180px;
  225. ">
  226.         </div>
  227.         </div>
  228.        
  229.        
  230.         <div class="input-group">
  231.         <div class="col-3">
  232.         <span class="input-group-addon" id="basic-addon1">EIN op eindetiket</span>
  233.         </div>
  234.         <div class="col-9">
  235.         <input type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  236.     width: 300px;
  237. ">
  238.         </div>
  239.         </div>
  240.        
  241.        
  242.         <div class="input-group">
  243.         <div class="col-3">
  244.         <span class="input-group-addon" id="basic-addon1">Code ISO-groep</span>
  245.         </div>
  246.         <div class="col-9">
  247.         <input type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  248.     width: 50px;
  249. ">
  250.         </div>
  251.         </div>
  252.        
  253.        
  254.         <div class="input-group">
  255.         <div class="col-3">
  256.         <span class="input-group-addon" id="basic-addon1">Naam patient</span>
  257.         </div>
  258.         <div class="col-9">
  259.         <input type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  260.     width: 450px;
  261. ">
  262.         </div>
  263.         </div>
  264.         </br>
  265.         </div> 
  266.         <div class="col-12" style="padding: 5px;
  267.           border:1px solid #929292;
  268.           -webkit-box-shadow:0px 0px 1px 1px #929292 ;
  269. -moz-box-shadow:0px 0px 1px 1px #929292 ;
  270. box-shadow:0px 0px 1px 1px #929292 ;">
  271.             <div class="input-group">
  272.         <span class="input-group-addon" id="basic-addon1">Origineel EIN</span>
  273.         <input type="text" class="form-control" placeholder="" aria-describedby="basic-addon1" style="
  274.     max-width: 300px;
  275. ">
  276.         </div>
  277.         </br></br>     
  278.                
  279.        
  280.            
  281.         </div> 
  282.         </form>
  283.     </div>
  284.    </div>  
  285.    
  286.    
  287.    
  288.     <div class="col-2" style="
  289.     padding-left: 0;
  290.     background-color: #afafaf;
  291. ">
  292.  
  293.     <img class="img-responsive" src="./img/logo.png" alt="Logo" style="
  294.     width: 100%;
  295. ">
  296. <!-- button on side -->
  297. <div class="btn-group btn-group-vertical btn-group-lg" style="
  298.     padding-top: 20px;
  299.     padding-right: 58px;
  300.     padding-left: 58px;
  301.     padding-bottom: 20px;
  302. ">
  303. <center>
  304.             <button type="button" id="myBtn" class="btn-group btn-group-sm" style="
  305.     margin: 25px; text-align: center;
  306.  
  307. ">
  308.                 <center style="vertical-align: middle;">Esc</center>
  309.             </button>
  310.  
  311.  
  312.            
  313.            
  314.  
  315.     </div>
  316.           </div>
  317.      
  318.    
  319.     </div>
  320.      <!-- Messages -->
  321.  <!-- The Modal -->
  322. <div id="myModal" class="modal">
  323.  
  324.   <!-- Modal content -->
  325.   <div class="modal-content">
  326.    <header class="header">
  327.      <a href="#" class="close" style="
  328.     font-size: 15px;margin-top: -5px; width: 0.675em;
  329.     height: 0.475em;
  330.     width: 15px;
  331.     height: 15px;
  332.     background-color: tomato;
  333.    
  334. ">x</a>  
  335.     </header>
  336.    
  337.     <p>Some text in the Modal..</p>
  338.   </div>
  339.  
  340. </div>
  341.   <!-- Bootstrap core JavaScript -->
  342.    
  343.     <script src="vendor/popper/popper.min.js"></script>
  344.     <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
  345.     <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
  346.    
  347.    
  348.    
  349.    
  350.    
  351.   <script>
  352. // Get the modal
  353. var modal = document.getElementById('myModal');
  354.  
  355. // Get the button that opens the modal
  356. var btn = document.getElementById("myBtn");
  357.  
  358. // Get the <span> element that closes the modal
  359. var span = document.getElementsByClassName("close")[0];
  360.  
  361. // When the user clicks the button, open the modal
  362. btn.onclick = function() {
  363.     modal.style.display = "block";
  364. }
  365.  
  366. // When the user clicks on <span> (x), close the modal
  367. span.onclick = function() {
  368.     modal.style.display = "none";
  369. }
  370.  
  371. // When the user clicks anywhere outside of the modal, close it
  372. window.onclick = function(event) {
  373.     if (event.target == modal) {
  374.         modal.style.display = "none";
  375.     }
  376. }
  377. </script>
  378.   </body>
  379.  
  380. </html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top