Guest User

402165

a guest
Aug 7th, 2019
441
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!doctype html>
  2.  
  3. <html lang="en">
  4.  
  5. <head>
  6.     <meta charset="utf-8">
  7.  
  8.     <title>The Populate</title>
  9.     <meta name="description" content="The Populate">
  10.     <meta name="author" content="wagner fillio">
  11.  
  12.     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  13.     <!--<link rel="stylesheet" href="css/styles.css?v=1.0">-->
  14.  
  15. </head>
  16.  
  17. <body>
  18.     <div>
  19.         <form id="form">
  20.             <div>
  21.                 <label for="sel-account">ACCOUNT</label>
  22.                 <select type="text" id="sel-account">
  23.                     <option id="0" value="0">Create Account</option>
  24.                     <option id="1" value="1">Load Account</option>
  25.                 </select>
  26.             </div>
  27.             <div>
  28.                 <label for="nome">Description</label>
  29.                 <input type="text" id="account-description" />
  30.             </div>
  31.             <div>
  32.                 <label for="account-bank">Bank</label>
  33.                 <select type="text" id="account-bank">
  34.                     <option>teste</option>
  35.                 </select>
  36.             </div>
  37.             <div>
  38.                 <label for="msg">Agency</label>
  39.                 <input type="text" id="account-agency" />
  40.             </div>
  41.             <div>
  42.                 <label for="msg">Account</label>
  43.                 <input type="text" id="account-account" />
  44.             </div>
  45.         </form>
  46.     </div>
  47.     <style>
  48.         form {
  49.             margin: 0 auto;
  50.             width: 400px;
  51.             padding: 1em;
  52.             border: 1px solid #CCC;
  53.             border-radius: 1em;
  54.         }
  55.        
  56.         form div + div {
  57.             margin-top: 1em;
  58.         }
  59.        
  60.         label {
  61.             display: inline-block;
  62.             width: 90px;
  63.             text-align: right;
  64.         }
  65.        
  66.         input,
  67.         select {
  68.             font: 1em sans-serif;
  69.             width: 300px;
  70.             -moz-box-sizing: border-box;
  71.             box-sizing: border-box;
  72.             border: 1px solid #999;
  73.         }
  74.     </style>
  75.     <!--<script src="js/scripts.js"></script>-->
  76.     <script>
  77.         $(document).ready(function() {
  78.             $('#sel-account').on('change', function() {
  79.                 let id = this.value;
  80.                 getAccountAjax(id);
  81.             });
  82.         });
  83.  
  84.         /** Object **/
  85.         function objectFormAccount() {
  86.             pupulateBank(objectAccount.banks, objectAccount.bank_id);
  87.             if (objectAccount.id != 0) {
  88.                 $('#account-description').val(objectAccount.description);
  89.                 //$('#account-bank').val(objectAccount.bank_id);
  90.                 $('#account-agency').val(objectAccount.agency);
  91.                 $('#account-account').val(objectAccount.account);
  92.                 $('#account-beneficiary').val(objectAccount.beneficiary);
  93.                 $('#account-type').val(objectAccount.type);
  94.                 $('#account-balance').val(objectAccount.balance);
  95.                 $('#account-default').prop('checked', objectAccount.default);
  96.             }
  97.         }
  98.  
  99.         /** function **/
  100.         function pupulateBank(array, bank_id) {
  101.             $('#account-bank').get(0).options.length = 0;
  102.             $.each(array, function(i, p) {
  103.                 $('#account-bank').append($('<option></option>').val(p.id).html(p.name).attr('selected', p.id === bank_id));
  104.             });
  105.         }
  106.  
  107.         /** ajax **/
  108.         function getAccountAjax(id) {
  109.  
  110.             let bank_id = null;
  111.             let description = null;
  112.             let agency = null;
  113.             let account = null;
  114.  
  115.             if (id > 0) {
  116.                 bank_id = 3;
  117.                 description = 'teste';
  118.                 agency = '1234';
  119.                 account = '1234-5';
  120.             } else {
  121.                 $('#form')[0].reset();
  122.                 bank_id = 0;
  123.                 description = null;
  124.                 agency = null;
  125.                 account = null;
  126.             }
  127.  
  128.             data = {
  129.                 "id": id,
  130.                 "bank_id": bank_id,
  131.                 "banks": [{
  132.                     "id": 1,
  133.                     "bank_code": "341",
  134.                     "name": "Ita\u00fa Unibanco S.A.",
  135.                     "image": "default.jpg"
  136.                 }, {
  137.                     "id": 2,
  138.                     "bank_code": "237",
  139.                     "name": "Banco Bradesco S.A.",
  140.                     "image": "default.jpg"
  141.                 }, {
  142.                     "id": 3,
  143.                     "bank_code": "001",
  144.                     "name": "Banco do Brasil S.A.",
  145.                     "image": "default.jpg"
  146.                 }, {
  147.                     "id": 4,
  148.                     "bank_code": "104",
  149.                     "name": "Caixa Econ\u00f4mica Federal",
  150.                     "image": "default.jpg"
  151.                 }, {
  152.                     "id": 5,
  153.                     "bank_code": "033",
  154.                     "name": "Banco Santander (Brasil) S.A.",
  155.                     "image": "default.jpg"
  156.                 }, {
  157.                     "id": 6,
  158.                     "bank_code": "389",
  159.                     "name": "Banco Mercantil do Brasil S.A.",
  160.                     "image": "default.jpg"
  161.                 }],
  162.                 "description": description,
  163.                 "agency": agency,
  164.                 "account": account,
  165.                 "beneficiary": null,
  166.                 "type": 0,
  167.                 "balance": 0,
  168.                 "default": false
  169.             }
  170.             objectAccount = data;
  171.             objectFormAccount();
  172.         }
  173.     </script>
  174. </body>
  175.  
  176. </html>
RAW Paste Data

Adblocker detected! Please consider disabling it...

We've detected AdBlock Plus or some other adblocking software preventing Pastebin.com from fully loading.

We don't have any obnoxious sound, or popup ads, we actively block these annoying types of ads!

Please add Pastebin.com to your ad blocker whitelist or disable your adblocking software.

×