ajaxMock

by Akram kamal

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mockjax/1.5.3/jquery.mockjax.js"></script>
<div align="center">
     <h4>Demo - Fake (Mock) request to server via mockjax</h4>

    <div>
        <p align="center">
            <button onclick="sayHelloFake();" class="btn btn-primary">Test Fack Ajax Request</button>
        </p>
        	<h5>Output will render below</h5>

        <div id="output_fake" class="output"></div>
    </div>
</div>

CSS

@import url('http://getbootstrap.com/dist/css/bootstrap.css');
 @import url('http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
 .output {
    height: 100px;
    width: 500px;
    border:1px solid #ccc;
    border-radius:5px;
}
h5 {
    color:#aaa
}

JavaScript

function sayHelloFake() {

    $.mockjax({
        url: "hello.php",
        responseTime: 0,
        responseText: 'A text response from mock'
    });

    $.ajax({
        url: "hello.php"
    }).done(function (response) {
        $('#output_fake').html(response);
        $.mockjaxClear();
    });
}