Wednesday, August 14, 2019

How to create an asynchronic Javascript Promise

The Application Cache of HTML5

by carmel schvartzman
In this page we see how to create an asynchronic Javascript Promise. We use Jquery and HTML5.

How to create an asynchronic Javascript Promise



<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    
    //////  this line uses the Promise :
    fnPromise('Hello').then((url) => { console.warn(`DATA = ${url}`); },(e) => { alert('ERROR = ' + e); });
    
  });
});

 //////  this is the Promise :
const fnPromise = (url) => { 

return new Promise((resolve,reject) => {    
    if(url !== null) resolve(url);
        else reject('Bad request');
    }
    );
}

</script>
</head>
<body>
<button>Call a Promise and get the result back</button>
</body>
</html>


That’s all: enjoy HTML5!!!

עריכה: כרמל שוורצמן

Tuesday, April 30, 2019

Simple Twitter Bootstrap Form Building-block

The Application Cache of HTML5

by carmel schvartzman

The following is a building block to create a Form :




<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Form Building-block</h2>
  <form action="/action_page.php">

  <div class="panel panel-primary">
     <div class="panel-heading  panel-primary">
      <h3 class="panel-title ">Create Employee</h3>
    </div>
    <div class="panel-body  panel-primary">
    <div class="form-group">
      <label for="email">Email:</label>
      <input type="email" class="form-control" id="email" placeholder="Enter email" name="email">
    </div>
    <div class="form-group">
      <label for="pwd">Password:</label>
      <input type="password" class="form-control" id="pwd" placeholder="Enter password" name="pwd">
    </div>
    <div class="checkbox">
      <label><input type="checkbox" name="remember"> Remember me</label>
    </div>
 
     </div>
    <div class="panel-footer panel-primary">
      <button class="btn btn-primary" type="submit">Save</button>
    </div>
 
  </form>
</div>

</body>
</html>


That’s all: enjoy HTML5!!!

עריכה: כרמל שוורצמן