Skip to content

Ajax Example

Jump to bottom Edit New page
Clément Prod'homme edited this page Dec 21, 2021 · 5 revisions

Example of calling health_check using ajax

  1. Copy the following html code to a file under your RAILS_ROOT/public directory eg RAILS_ROOT/public/ajax_example.html
  2. Install health_check gem
  3. run the rails server
  4. Browse to the file, eg http://localhost:3000/ajax_example.html
  5. Click on the two dynamic links to trigger the ajax call, and view the results

contents of RAILS_ROOT/public/ajax_example.html

<html>
<head>
  <title>Example static and dynamic calls to health_check</title>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script>
    function parse_result(result, callback) {
        $("#html_status_"+callback).text(result.status);
        $("#html_body_"+callback).text(result.responseText);
        alert(callback + " callback called");
    };

    function dynamic_call(dataType, url) {
      $.ajax({
        dataType: dataType,
        url: url,
        success: function(data, textStatus, result) {
          $("#data_success").text(data);
          parse_result(result, "success");
        },
        error: function(result, textStatus) {
          parse_result(result, "error");
        },
        complete: function(result, textStatus) {
          parse_result(result, "complete");
        }
      });
    };
  </script>
  </head>
  <body>
    <h1>Static calls</h1>
    <ul>
      <li><a href="http://localhost:3000/health_check/site" target="_blank">Minimal health check should always work</a>
        (<a href="http://localhost:3000/health_check/site.json" target="_blank">json</a>,
        <a href="http://localhost:3000/health_check/site.xml" target="_blank">xml</a>,
        <a href="http://localhost:3000/health_check/site.html" target="_blank">html</a>)
      <li><a href="http://localhost:3000/health_check/fail" target="_blank">Force health check to fail!</a>
        (<a href="http://localhost:3000/health_check/fail.json" target="_blank">json</a>,
        <a href="http://localhost:3000/health_check/fail.xml" target="_blank">xml</a>,
        <a href="http://localhost:3000/health_check/fail.html" target="_blank">html</a>)
          </ul>
          <h1>Dynamic calls</h1>
          <ul>
      <li><a href="#" onclick="dynamic_call('text', 'http://localhost:3000/health_check/site');">Minimal health check should always work</a>
        (<a href="#" onclick="dynamic_call('json', 'http://localhost:3000/health_check/site.json');">json</a>,
        <a href="#" onclick="dynamic_call('site', 'http://localhost:3000/health_check/site.xml');">xml</a>,
        <a href="#" onclick="dynamic_call('text', 'http://localhost:3000/health_check/site.html');">html</a>)

      <li><a href="#" onclick="dynamic_call('text', 'http://localhost:3000/health_check/fail');">Force health check to fail!</a>
        (<a href="#" onclick="dynamic_call('json', 'http://localhost:3000/health_check/fail.json');">json</a>,
        <a href="#" onclick="dynamic_call('site', 'http://localhost:3000/health_check/fail.xml');">xml</a>,
        <a href="#" onclick="dynamic_call('text', 'http://localhost:3000/health_check/fail.html');">html</a>)
      <li>Last results sent to success:<ul>
        <li><b>Data:</b><span id=data_success></span>
        <li><b>result.status:</b><span id=html_status_success></span>
        <li><b>result.responseText:</b><span id=html_body_success></span>
      </ul>
      <li>Last results sent to error:<ul>
        <li><b>result.status:</b><span id=html_status_error></span>
        <li><b>result.responseText:</b><span id=html_body_error></span>
      </ul>
      <li>Last results sent to complete:<ul>
        <li><b>result.status:</b><span id=html_status_complete></span>
        <li><b>result.responseText:</b><span id=html_body_complete></span>
      </ul>
    </ul>
  </body>
</html>
Add a custom footer
Add a custom sidebar
Clone this wiki locally