scratch pad

scratchpad for some new app UI

HTML

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<body>
<div id='ajax-response'>
    <form method='post' action=''>
    <textarea cols='30' rows='5' name='test'></textarea>
    <input id='sub' type='button' value='ok' />
</form>
</div>
</body>

CSS

BODY {
    margin: 20px;
    font-family: Tahoma, Sans-serif;
}

DIV {
    margin: 0px;
}

#container {
}

.title {
    margin-bottom: 20px;
}

.availability-info {
    min-width: 360px;
    height: auto;
    font-size: small;
    background-color: #efefef;
    border: 1px solid #e3e3e3;
    display: inline-block;
}
.availability-info .header,
.availability-info .row {
    clear: left;
    height: 15px;
}
.availability-info .header {
    color: #969696;
}
.availability-info .row {
    border-top: 1px solid #e3e3e3;
}
.availability-info .column {
    float: left;
    width: 30px;
    text-align: center;
    border-left: 1px solid #e3e3e3;
    padding: 4px 2px 4px 2px;
    color: #393939;
}
.availability-info .first {
    min-width: 100px;
    text-align: left;
    border-left: none;
    padding: 4px 2px 4px 6px;
}

JavaScript

$('textarea').click(function() {alert('ouch!');});

$('#sub').click(function(event) {
            $.ajax({
        cache:false,
         type: 'POST',
         url: '/echo/html/',
         data: {
             html:"<form method='post' action=''><textarea cols='30' rows='5' name='test2'></textarea><input type='submit' value='ok' /></form>"
         },
         success: function(data) {
             $('#ajax-response').html(data);
             $('textarea').click(function() {alert('ouch!');});
         },
         error:function(error){
             alert('there was an error');  
         },
         dataType: 'html'
     });
});