Synchronous AJAX

HTML

<script src="https://dl.dropbox.com/u/19536220/js/jquery.loadmask.js"></script>
<link rel="stylesheet" href="http://jquery-loadmask.googlecode.com/svn/trunk/src/jquery.loadmask.css">
Please fill out the form:
<div id="content">
  <div>Field1:
    <input type="text">
  </div>
  <div>Field2:
    <input type="text">
  </div>
  <div>Field3:
    <input type="text">
  </div>
  <div>Field4:
    <input type="text">
  </div>
</div>
<div id="buttons">
  <input type="button" value="Process" id="process">
</div>

CSS

body {
   font-size:11px;
   font-family:tahoma;
 }
 #content {
   padding:5px;
   width:200px;
 }
 #buttons {
   padding-left:40px;
 }

JavaScript

$(document).ready(function () {
  $("#process").bind("click", function () {

    var data = {
      json: JSON.stringify({
        text: 'Echo JSON'
      }),
      delay: 3
    };

    $("#content").mask("Waiting...");
    $.ajax({
      url: '/echo/json/',
      dataType: 'json',
      data: data,
      success: function (data) {
        $("#content").unmask();
      },
      type: 'POST',
      aysnc : false
    });
  });

});