1. application/controllers/blog.php
2. application/views/blogview.php
3. application/views/form.php
4. application/views/view.php
======================== blog.php ===================
<?php
class Blog extends CI_Controller{
function index()
{
$page = "blog/page";
header("Location: $page");
}
function page()
{
$this->load->view('blogview');
}
function form()
{
$form = $this->load->view('form','',TRUE);
echo $form;
}
function insertpost($title,$content)
{
$title = urldecode($title);
$content = urldecode($content);
$data = array(
'title'=>$title,
'content'=>$content
);
$this->db->insert('article',$data);
}
function view()
{
$query = $this->db->get('article');
$data['hasil'] = $query->result();
$this->load->view('view',$data);
}
}
?>
================== blogview.php ======================
<html><head>
<title>Blog Application</title>
<script>
function createNew(){
var page = document.getElementById('page');
var ajax = new XMLHttpRequest();
ajax.onreadystatechange = function(){
page.innerHTML = ajax.responseText;
}
ajax.open('POST','form',false);
ajax.send();
}
function lol(){
var title = document.getElementById('title').value;
var content = document.getElementById('content').value;
var ajax = new XMLHttpRequest();
ajax.open('POST','insertpost/'+title+'/'+content,true);
ajax.send();
var page = document.getElementById('page');
page.innerHTML = '<h1>Your post saved successfully!</h1>';
}
function view(){
var page = document.getElementById('page');
var ajax = new XMLHttpRequest();
ajax.onreadystatechange = function(){
page.innerHTML = ajax.responseText;
}
ajax.open('POST','view',true);
ajax.send();
}
</script>
</head>
<body>
<h1 id="header">
Blog Application
</h1>
<div id="nav">
<a href="javascript:createNew()" id="nav-first">Create New</a>
<a href="">Edit</a>
<a href="javascript:view()">View</a>
</div>
<div id="page">
<h1>This is the content</h1>
</div>
<div id="footer">
<p>©2011, irfan.ub@gmail.com</p>
</div>
<style>
html, body, div, h1 { margin: 0px; }
html { background: #aaf; font: 12px arial; }
body { background: white; padding: 10px; margin: 10px; border: 1px solid #aaa; border-radius: 10px;}
#header { background: #55f; color: white; padding: 10px; -moz-border-radius-topleft: 10px;-moz-border-radius-topright: 10px; border-bottom: 2px solid white; }
#nav { background: #99f; padding: 5 0px; -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; }
#nav a { color: white; font: 14px arial; padding: 5 10px; text-decoration: none; font-weight: bold; }
#nav a:hover { background: #ccf; color: blue; }
#nav-first { -moz-border-radius-bottomleft: 4px; }
#page { border: 1px solid #aaa; margin: 10 0 0; border-radius: 4px; padding: 10px; }
#footer { text-align: center; background: #ccc; margin: 10 0 0px; border-radius: 4px; color: #555;}
#footer p {padding: 5px; }
</style>
</body>
</html>
================== form.php ===================
<div id="form">
<h2>Entry New Post</h2>
<table>
<form action="insertpost" method="post">
<tr><td><span id="sp-title">Title</span></td><td>:</td><td><input type="text" id="title" name="title" size="50"/></td></tr>
<tr><td colspan="3"><textarea cols="50" rows="10" id="content" name="content"></textarea></td></tr>
<tr><td colspan="3"><input type="button" id="submit" onclick="lol()" value="Save"/><td></tr>
</form>
</table>
</div>
<style>
#form h2 { font-family: arial; }
#sp-title { font: 16px arial; font-weight: bold; }
#title { border-radius: 4px; border: 1px solid #aaa; padding: 2px;}
#title:hover { box-shadow: 0 0 10px gold; border: 1px solid #ccc; }
#content { border-radius: 4px; border: 1px solid #aaa; padding; 4px; }
#content:hover { box-shadow: 0 0 10px gold; border: 1px solid #ddd; }
#submit { background: #88f; color: white; border: 1px solid #eee; padding: 3 10; cursor: pointer; font: 12px arial; border-radius: 20px; width: 100px; }
#submit:hover { background: #55f; }
</style>
<h2>Entry New Post</h2>
<table>
<form action="insertpost" method="post">
<tr><td><span id="sp-title">Title</span></td><td>:</td><td><input type="text" id="title" name="title" size="50"/></td></tr>
<tr><td colspan="3"><textarea cols="50" rows="10" id="content" name="content"></textarea></td></tr>
<tr><td colspan="3"><input type="button" id="submit" onclick="lol()" value="Save"/><td></tr>
</form>
</table>
</div>
<style>
#form h2 { font-family: arial; }
#sp-title { font: 16px arial; font-weight: bold; }
#title { border-radius: 4px; border: 1px solid #aaa; padding: 2px;}
#title:hover { box-shadow: 0 0 10px gold; border: 1px solid #ccc; }
#content { border-radius: 4px; border: 1px solid #aaa; padding; 4px; }
#content:hover { box-shadow: 0 0 10px gold; border: 1px solid #ddd; }
#submit { background: #88f; color: white; border: 1px solid #eee; padding: 3 10; cursor: pointer; font: 12px arial; border-radius: 20px; width: 100px; }
#submit:hover { background: #55f; }
</style>
================== view.php ===========================
<div id="page-post"><?php
foreach($hasil as $lol): ?>
<div class="post">
<h3><?php echo $lol->title; ?></h3>
<p><?php echo $lol->content; ?></p>
</div>
<?php endforeach; ?>
</div>
<style>
.post { border: 1px solid #aaa; border-radius: 4px; margin-bottom: 10px; padding: 10px; background: azure; }
.post h3 { color: #55f; text-transform: capitalize;}
.post p { font: 12px arial; }
</style>
No comments:
Post a Comment