Created
August 22, 2014 13:10
-
-
Save beames/e50fbdcade2dc76ea629 to your computer and use it in GitHub Desktop.
Mojax test mockjax demo // source http://jsbin.com/mafuco/1
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html lang="en"> | |
<head> | |
<meta name="description" content="mockjax demo" /> | |
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> | |
<script src=" http://cdnjs.cloudflare.com/ajax/libs/jquery-mockjax/1.5.3/jquery.mockjax.js"></script> | |
<meta charset="UTF-8"> | |
<title>Mojax test</title> | |
<style id="jsbin-css"> | |
table td{border-bottom:1px solid #ccc;padding:4px;margin:0} | |
</style> | |
</head> | |
<body> | |
<h1> Fake Ajax Request - Data from Var</h1> | |
<div id="output_fake_json" class="output"> | |
</div> | |
<h1>Fake ajax - proxy to fillText API</h1> | |
<table id="records" cellspacing="0"></table> | |
<!-- Github Page Example --> | |
<h1>Github Page Example</h1> | |
<div id="fortune"></div> | |
<script id="jsbin-javascript"> | |
var sampledata = { | |
"employees": [{ | |
"firstName": "Vikas", | |
"lastName": "Bhagwagar" | |
}, { | |
"firstName": "Gaurav", | |
"lastName": "Patel" | |
}, { | |
"firstName": "Ankur", | |
"lastName": "Shah" | |
}] | |
}; | |
//from local data | |
$.mockjax({ | |
url: "sampledata.php", | |
contentType: 'text/json', | |
responseTime: 0, | |
dataType: 'json', | |
responseText: sampledata | |
// proxy: 'sample.json', | |
}); | |
//from fillText API | |
$.mockjax({ | |
url: "filltextdata.php", | |
proxy: 'http://www.filltext.com/?', | |
data:{ | |
'rows': 10, | |
'fname': '{firstName}', | |
'lname': '{lastName}', | |
'tel': '{phone|format}', | |
}, | |
responseTime: 0, | |
dataType: 'json' | |
}); | |
//ajax From Var | |
(function FakeJSONFromVar (){ | |
$.ajax({ | |
url: "sampledata.php", | |
dataType: 'json' | |
}).done(function (json_response) { | |
var names = []; | |
for (var i in json_response.employees) { | |
names.push(json_response.employees[i].firstName); | |
} | |
output = names.join("<br/>"); | |
$('#output_fake_json').html(output); | |
$.mockjaxClear(); | |
}); | |
})(); | |
//ajax from proxy to fillTextAPI | |
(function ProxytofillTextAPI() { | |
$.ajax({ | |
url: "filltextdata.php", | |
dataType: 'json' | |
}) | |
.done(function( data ) { | |
$.each( data, function( i, item ) { | |
var html = | |
"<td>" + item.fname + "</td>" + | |
"<td>" + item.lname + "</td>" + | |
"<td>" + item.tel + "</td>"; | |
$("<tr/>").html(html).appendTo("#records"); | |
}); | |
}); | |
})(); | |
$.mockjax({ | |
url: '/restful/fortune', | |
responseTime: 10, | |
responseText: { | |
status: 'success', | |
fortune: 'Are you a turtle?' | |
} | |
}); | |
// Github Page Example | |
$.getJSON('/restful/fortune', function(response) { | |
if ( response.status == 'success') { | |
$('#fortune').html( 'Your fortune is: ' + response.fortune ); | |
} else { | |
$('#fortune').html( 'Things do not look good, no fortune was told' ); | |
} | |
}); | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
table td{border-bottom:1px solid #ccc;padding:4px;margin:0} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var sampledata = { | |
"employees": [{ | |
"firstName": "Vikas", | |
"lastName": "Bhagwagar" | |
}, { | |
"firstName": "Gaurav", | |
"lastName": "Patel" | |
}, { | |
"firstName": "Ankur", | |
"lastName": "Shah" | |
}] | |
}; | |
//from local data | |
$.mockjax({ | |
url: "sampledata.php", | |
contentType: 'text/json', | |
responseTime: 0, | |
dataType: 'json', | |
responseText: sampledata | |
// proxy: 'sample.json', | |
}); | |
//from fillText API | |
$.mockjax({ | |
url: "filltextdata.php", | |
proxy: 'http://www.filltext.com/?', | |
data:{ | |
'rows': 10, | |
'fname': '{firstName}', | |
'lname': '{lastName}', | |
'tel': '{phone|format}', | |
}, | |
responseTime: 0, | |
dataType: 'json' | |
}); | |
//ajax From Var | |
(function FakeJSONFromVar (){ | |
$.ajax({ | |
url: "sampledata.php", | |
dataType: 'json' | |
}).done(function (json_response) { | |
var names = []; | |
for (var i in json_response.employees) { | |
names.push(json_response.employees[i].firstName); | |
} | |
output = names.join("<br/>"); | |
$('#output_fake_json').html(output); | |
$.mockjaxClear(); | |
}); | |
})(); | |
//ajax from proxy to fillTextAPI | |
(function ProxytofillTextAPI() { | |
$.ajax({ | |
url: "filltextdata.php", | |
dataType: 'json' | |
}) | |
.done(function( data ) { | |
$.each( data, function( i, item ) { | |
var html = | |
"<td>" + item.fname + "</td>" + | |
"<td>" + item.lname + "</td>" + | |
"<td>" + item.tel + "</td>"; | |
$("<tr/>").html(html).appendTo("#records"); | |
}); | |
}); | |
})(); | |
$.mockjax({ | |
url: '/restful/fortune', | |
responseTime: 10, | |
responseText: { | |
status: 'success', | |
fortune: 'Are you a turtle?' | |
} | |
}); | |
// Github Page Example | |
$.getJSON('/restful/fortune', function(response) { | |
if ( response.status == 'success') { | |
$('#fortune').html( 'Your fortune is: ' + response.fortune ); | |
} else { | |
$('#fortune').html( 'Things do not look good, no fortune was told' ); | |
} | |
}); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment