jquery AJAX
HTML
<form method="post" id="form">
<div id="json"></div>
<div id="xml">
User: <span id="userid"></span>
<input id="name" type="text">
Password: <span id="sessionid"></span>
<input type="text">
</div>
<button id="submit">Login</button>
</form>
CSS
#html, #json, #jsonp, #xml, #form {
border: 1px dashed #ccc;
margin: 10px 0;
}
#html img {
width: 50px;
}
#user-login {
background-color: #fff;
padding: 4px 7px 2px 7px;
}
#user-avatar {
float: left;
}
#user-avatar .avatar {
border: 1px solid #ddd;
padding: 1px;
width: 24px;
}
#user-overview {
margin-left: 36px;
}
#user-overview h1 a {
font-size: 13px;
text-decoration: none;
}
#user-overview h1 a:hover {
text-decoration: underline;
}
#user-overview p {
color: #666;
font: italic normal 10px arial, sans-serif;
}
#user-overview p a {
color: #333;
text-decoration: none;
}
#user-content {
background: #fafafa;
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#fafafa', endColorstr='#efefef');
background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#efefef));
background: -moz-linear-gradient(top, #fafafa, #efefef);
border-top: 1px solid #eee;
}
#octocat {
background: url(data:image/png;
base64,...
JavaScript
$('#submit').click(function (evt) {
// console.log($('#name'));
$('#json').append('hello');
$.ajax({
url: '/echo/json/',
dataType: 'json',
type: 'POST',
data: {
json: JSON.stringify("Hello");
}
}).done(function (data) {
$('#json').append('hello');
});
});