API tools faq
paste
Guest User

402165

a guest
Aug 7th, 2019
441
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 5.57 KB
raw download clone embed print report
  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
Public Pastes
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
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!
 

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.

×