<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>little brain &#187; tutorial</title>
	<atom:link href="http://littlebrain.org/category/tutorial/feed/" rel="self" type="application/rss+xml" />
	<link>http://littlebrain.org</link>
	<description>me and my brain</description>
	<lastBuildDate>Sun, 20 Jun 2010 15:31:36 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>An Error Occurred During The Signature Verification</title>
		<link>http://littlebrain.org/2008/11/25/an-error-occurred-during-the-signature-verification/</link>
		<comments>http://littlebrain.org/2008/11/25/an-error-occurred-during-the-signature-verification/#comments</comments>
		<pubDate>Tue, 25 Nov 2008 02:55:56 +0000</pubDate>
		<dc:creator>Aldiantoro Nugroho</dc:creator>
				<category><![CDATA[linux]]></category>
		<category><![CDATA[tutorial]]></category>
		<category><![CDATA[ubuntu]]></category>
		<category><![CDATA[apt-get]]></category>
		<category><![CDATA[apt-key]]></category>
		<category><![CDATA[gpg]]></category>

		<guid isPermaLink="false">http://littlebrain.org/?p=211</guid>
		<description><![CDATA[If you&#8217;re using ubuntu as your choice of linux distribution, and you like to add some unofficial repositories, you probably find some warnings when you run apt-get update command. The warnings are probably like this W: A error occurred during &#8230; <a href="http://littlebrain.org/2008/11/25/an-error-occurred-during-the-signature-verification/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>If you&#8217;re using ubuntu as your choice of linux distribution, and you like to add some unofficial repositories, you probably find some warnings when you run <code>apt-get update</code> command.</p>
<p>The warnings are probably like this</p>

<div class="wp_syntax"><div class="code"><pre class="text" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">W: A error occurred during the signature verification. The repository is not updated and the previous index files will be used.GPG error: http://dl.google.com stable Release: The following signatures couldn't be verified because the public key is not available: NO_PUBKEY A040830F7FAC5991
&nbsp;
W: Failed to fetch http://dl.google.com/linux/deb/dists/stable/Release  
&nbsp;
W: Some index files failed to download, they have been ignored, or old ones used instead.
W: You may want to run apt-get update to correct these problems</pre></div></div>

<p>That&#8217;s the warnings I got when I added google debian repository. There won&#8217;t be anything bad about it, since we could still install the packages from that repositories. But, I we could get rid the warnings, that&#8217;s would be a lot better. We could use gpg command to get the key.</p>
<p><b>Short Version</b></p>
<p>For you who don&#8217;t want to read pointless explanations below, here&#8217;s the short version</p>

<div class="wp_syntax"><div class="code"><pre class="text" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">gpg --keyserver hkp://subkeys.pgp.net --recv-keys A040830F7FAC5991
gpg --export --armor 7FAC5991 | sudo apt-key add -</pre></div></div>

<p><b>Long Version</b></p>
<p>Here&#8217;s the explained step. First we have to get the key from the key server.</p>

<div class="wp_syntax"><div class="code"><pre class="text" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">gpg --keyserver hkp://subkeys.pgp.net --recv-keys A040830F7FAC5991</pre></div></div>

<p>The <code>A040830F7FAC5991</code> is from the warning shown before. You might want to change it if you have different repository. For the google repository, you should get this as the output</p>

<div class="wp_syntax"><div class="code"><pre class="text" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">gpg: requesting key 7FAC5991 from hkp server subkeys.pgp.net
gpg: key 7FAC5991: public key &quot;Google, Inc. Linux Package Signing Key &lt;linux-packages-keymaster@google.com&gt;&quot; imported
gpg: 3 marginal(s) needed, 1 complete(s) needed, PGP trust model
gpg: depth: 0  valid:   1  signed:   0  trust: 0-, 0q, 0n, 0m, 0f, 1u
gpg: Total number processed: 1
gpg:               imported: 1</pre></div></div>

<p>After that, type</p>

<div class="wp_syntax"><div class="code"><pre class="text" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">gpg --export --armor 7FAC5991 | sudo apt-key add -</pre></div></div>

<p>Where the <code>7FAC5991</code> is from the output shown before.</p>
<p>After that you&#8217;ll get <code>OK</code> as the output. You may run <code>apt-get update</code> again.</p>
<p>Oh, one more thing, I only tested this method in opera and google repositories <img src='http://littlebrain.org/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://littlebrain.org/2008/11/25/an-error-occurred-during-the-signature-verification/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>CodeIgniter and Ajax Using JQuery Tutorial</title>
		<link>http://littlebrain.org/2008/05/27/codeigniter-and-ajax-using-jquery-tutorial/</link>
		<comments>http://littlebrain.org/2008/05/27/codeigniter-and-ajax-using-jquery-tutorial/#comments</comments>
		<pubDate>Tue, 27 May 2008 15:28:59 +0000</pubDate>
		<dc:creator>Aldiantoro Nugroho</dc:creator>
				<category><![CDATA[howto]]></category>
		<category><![CDATA[tutorial]]></category>
		<category><![CDATA[ajax]]></category>
		<category><![CDATA[ci]]></category>
		<category><![CDATA[codeigniter]]></category>
		<category><![CDATA[jquery]]></category>

		<guid isPermaLink="false">http://littlebrain.org/?p=172</guid>
		<description><![CDATA[I created this tutorial because I was having a hard time finding good simple CodeIgniter + JQuery tutorial for newbie like me. The one I found, created by MR Forbes, is hard to understand and apparently isn&#8217;t working. Another one, &#8230; <a href="http://littlebrain.org/2008/05/27/codeigniter-and-ajax-using-jquery-tutorial/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>I created this tutorial because I was having a hard time finding good simple <a href="http://codeigniter.com/">CodeIgniter</a> + <a href="http://jquery.com/">JQuery</a> tutorial for newbie like me. <a href="http://www.mrforbes.com/wordpress/2007/05/13/a-quick-code-igniter-and-jquery-ajax-tutorial/">The one I found</a>, created by MR Forbes, is hard to understand and apparently isn&#8217;t working. <a href="http://pr0digy.com/codeigniter/unobtrusive-ajax-with-codeigniter-and-mootools/">Another one</a>, pr0digy&#8217;s, is using Mootools for the AJAX framework.</p>
<p>So I decided to create my own CodeIgniter and JQuery tutorial based on pr0digy&#8217;s tutorial. I&#8217;m assuming you already know how to code using CodeIgniter. If you&#8217;re new to CodeIgniter, you need to find others tutorial first. <a href="http://codeigniter.com/tutorials/">The videos</a> given in CodeIgniter&#8217;s site is a good start.</p>
<p>This tutorial is about creating simple CodeIgniter + database + ajax system. User will be shown a form to post a message. Then after he/she press the submit button, the system will save the message using ajax and then show the message. You could see <a href="http://sandbox.littlebrain.org/ci/index.php/message/view">the result</a> first if you want.</p>
<h4>Database</h4>
<p>The first thing we need to do is creating a table to save the message. For this tutorial, We will use this:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
</pre></td><td class="code"><pre class="sql" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;"><span class="kw1">CREATE</span> <span class="kw1">TABLE</span> <span class="kw1">IF</span> <span class="kw1">NOT</span> <span class="kw1">EXISTS</span> <span class="st0">`messages`</span> <span class="br0">&#40;</span>
  <span class="st0">`id`</span> tinyint<span class="br0">&#40;</span><span class="nu0">4</span><span class="br0">&#41;</span> <span class="kw1">NOT</span> <span class="kw1">NULL</span> <span class="kw1">AUTO_INCREMENT</span><span class="sy0">,</span>
  <span class="st0">`message`</span> varchar<span class="br0">&#40;</span><span class="nu0">256</span><span class="br0">&#41;</span> <span class="kw1">NOT</span> <span class="kw1">NULL</span><span class="sy0">,</span>
  <span class="kw1">PRIMARY</span> <span class="kw1">KEY</span>  <span class="br0">&#40;</span><span class="st0">`id`</span><span class="br0">&#41;</span>
<span class="br0">&#41;</span></pre></td></tr></table></div>

<h4>Controller</h4>
<p>Then, we need to create a controller. My controller is named <code>message</code>. You could name your controller any name you like. After that, create 2 functions/methods, <strong>view</strong> and <strong>add</strong>.</p>
<p>view is used to get the default view and list of messages from the database. The codes are:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
</pre></td><td class="code"><pre class="php" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;"><span class="kw2">function</span> view<span class="br0">&#40;</span><span class="re0">$type</span> <span class="sy0">=</span> <span class="kw4">NULL</span><span class="br0">&#41;</span>
<span class="br0">&#123;</span>
    <span class="co1">// get data from database</span>
    <span class="re0">$data</span><span class="br0">&#91;</span><span class="st_h">'messages'</span><span class="br0">&#93;</span> <span class="sy0">=</span> <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">Message_model</span><span class="sy0">-&gt;</span><span class="me1">get</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="sy0">;</span>
&nbsp;
    <span class="kw1">if</span> <span class="br0">&#40;</span><span class="re0">$type</span> <span class="sy0">==</span> <span class="st0">&quot;ajax&quot;</span><span class="br0">&#41;</span> <span class="co1">// load inline view for call from ajax</span>
        <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">load</span><span class="sy0">-&gt;</span><span class="me1">view</span><span class="br0">&#40;</span><span class="st_h">'messages_list'</span><span class="sy0">,</span> <span class="re0">$data</span><span class="br0">&#41;</span><span class="sy0">;</span>
    <span class="kw1">else</span> <span class="co1">// load the default view</span>
        <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">load</span><span class="sy0">-&gt;</span><span class="me1">view</span><span class="br0">&#40;</span><span class="st_h">'default'</span><span class="sy0">,</span> <span class="re0">$data</span><span class="br0">&#41;</span><span class="sy0">;</span>
<span class="br0">&#125;</span></pre></td></tr></table></div>

<p>We fetch messages from the database using <code>Message_model->get()</code> function. Then the data is passed to the view. Here, we have 2 views called. One for the default view, where we called the page using <code>message/view</code>, and the other is for calling from ajax.</p>
<p>add is a proccess used to insert the message to the database. The codes are:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
</pre></td><td class="code"><pre class="php" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;"><span class="kw2">function</span> add<span class="br0">&#40;</span><span class="br0">&#41;</span>
<span class="br0">&#123;</span>
    <span class="co1">// if HTTP POST is sent, add the data to database</span>
    <span class="kw1">if</span><span class="br0">&#40;</span><span class="re0">$_POST</span> <span class="sy0">&amp;&amp;</span> <span class="re0">$_POST</span><span class="br0">&#91;</span><span class="st_h">'message'</span><span class="br0">&#93;</span> <span class="sy0">!=</span> <span class="kw4">NULL</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>
        <span class="re0">$message</span><span class="br0">&#91;</span><span class="st_h">'message'</span><span class="br0">&#93;</span> <span class="sy0">=</span> <span class="re0">$_POST</span><span class="br0">&#91;</span><span class="st_h">'message'</span><span class="br0">&#93;</span><span class="sy0">;</span>
        <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">Message_model</span><span class="sy0">-&gt;</span><span class="me1">add</span><span class="br0">&#40;</span><span class="re0">$message</span><span class="br0">&#41;</span><span class="sy0">;</span>
    <span class="br0">&#125;</span> <span class="kw1">else</span>
        redirect<span class="br0">&#40;</span><span class="st_h">'message/view'</span><span class="br0">&#41;</span><span class="sy0">;</span>
<span class="br0">&#125;</span></pre></td></tr></table></div>

<p>This function is accessed when we press the submit button from the form. This function will save the message using <code>Message_model->add()</code> function.</p>
<h4>Model</h4>
<p>The next thing we need to create is the model. I use <code>Message_model</code> for the name. Here we create two functions, <strong>add</strong> and <strong>get</strong>. add is a function to insert the data into the database. get is a function to retrieve data from database. I think the codes are pretty self-explainatory, but you could drop me a message if you need some explainations on the codes.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
</pre></td><td class="code"><pre class="php" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;"><span class="kw2">function</span> add<span class="br0">&#40;</span><span class="re0">$data</span><span class="br0">&#41;</span>
<span class="br0">&#123;</span>
    <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">db</span><span class="sy0">-&gt;</span><span class="me1">insert</span><span class="br0">&#40;</span><span class="st_h">'messages'</span><span class="sy0">,</span> <span class="re0">$data</span><span class="br0">&#41;</span><span class="sy0">;</span>
<span class="br0">&#125;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
</pre></td><td class="code"><pre class="php" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;"><span class="kw2">function</span> get<span class="br0">&#40;</span><span class="re0">$limit</span><span class="sy0">=</span><span class="nu0">5</span><span class="sy0">,</span> <span class="re0">$offset</span><span class="sy0">=</span><span class="nu0">0</span><span class="br0">&#41;</span>
<span class="br0">&#123;</span>
    <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">db</span><span class="sy0">-&gt;</span><span class="me1">orderby</span><span class="br0">&#40;</span><span class="st_h">'id'</span><span class="sy0">,</span> <span class="st_h">'DESC'</span><span class="br0">&#41;</span><span class="sy0">;</span>
    <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">db</span><span class="sy0">-&gt;</span><span class="me1">limit</span><span class="br0">&#40;</span><span class="re0">$limit</span><span class="sy0">,</span> <span class="re0">$offset</span><span class="br0">&#41;</span><span class="sy0">;</span>
&nbsp;
    <span class="kw1">return</span> <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">db</span><span class="sy0">-&gt;</span><span class="me1">get</span><span class="br0">&#40;</span><span class="st_h">'messages'</span><span class="br0">&#41;</span><span class="sy0">-&gt;</span><span class="me1">result</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="sy0">;</span>
<span class="br0">&#125;</span></pre></td></tr></table></div>

<h4>View</h4>
<p>I use 2 files for view section. <code>default.php</code> and <code>message_list.php</code>. The <code>message_list</code> is used for displaying the messages taken from the database.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
</pre></td><td class="code"><pre class="php" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">&lt;div id=&quot;form&quot;&gt;
    &lt;input type=&quot;text&quot; id=&quot;message&quot; name=&quot;message&quot; /&gt;
    &lt;input type=&quot;submit&quot; id=&quot;submit&quot; name=&quot;submit&quot; value=&quot;submit&quot; /&gt;
&lt;/div&gt;
&lt;div id=&quot;content&quot;&gt;
<span class="kw2">&lt;?php</span> <span class="re0">$this</span><span class="sy0">-&gt;</span><span class="me1">load</span><span class="sy0">-&gt;</span><span class="me1">view</span><span class="br0">&#40;</span><span class="st_h">'messages_list'</span><span class="br0">&#41;</span> <span class="sy1">?&gt;</span>
&nbsp;
&lt;/div&gt;</pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
</pre></td><td class="code"><pre class="php" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">&lt;ol&gt;
<span class="kw2">&lt;?php</span> <span class="kw1">foreach</span> <span class="br0">&#40;</span><span class="re0">$messages</span> <span class="kw1">as</span> <span class="re0">$message</span><span class="br0">&#41;</span><span class="sy0">:</span> <span class="sy1">?&gt;</span>
    &lt;li&gt;<span class="sy1">&lt;?=</span> <span class="re0">$message</span><span class="sy0">-&gt;</span><span class="me1">message</span> <span class="sy1">?&gt;</span>&lt;/li&gt;
<span class="kw2">&lt;?php</span> <span class="kw1">endforeach</span> <span class="sy1">?&gt;</span>
&lt;/ol&gt;</pre></td></tr></table></div>

<h4>Hey, Where&#8217;s the JQuery?</h4>
<p>Here we go. The last, and maybe the most important part of this tutorial. So, we the our controller, we had the model, and we had the views. I assume you already know how to include a jquery script to your view. The jquery codes are this:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;color: #ccc; font: 12px Consolas, Lucida Console, Monaco, monospace;">$<span class="br0">&#40;</span>document<span class="br0">&#41;</span>.<span class="me1">ready</span><span class="br0">&#40;</span><span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>
    $<span class="br0">&#40;</span><span class="st0">'#submit'</span><span class="br0">&#41;</span>.<span class="me1">click</span><span class="br0">&#40;</span><span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>
&nbsp;
        <span class="kw2">var</span> msg <span class="sy0">=</span> $<span class="br0">&#40;</span><span class="st0">'#message'</span><span class="br0">&#41;</span>.<span class="me1">val</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="sy0">;</span>
&nbsp;
        $.<span class="me1">post</span><span class="br0">&#40;</span><span class="st0">&quot;&lt;?= site_url('message/add') ?&gt;&quot;</span><span class="sy0">,</span> <span class="br0">&#123;</span>message<span class="sy0">:</span> msg<span class="br0">&#125;</span><span class="sy0">,</span> <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>
            $<span class="br0">&#40;</span><span class="st0">'#content'</span><span class="br0">&#41;</span>.<span class="me1">load</span><span class="br0">&#40;</span><span class="st0">&quot;&lt;?= site_url('message/view/ajax') ?&gt;&quot;</span><span class="br0">&#41;</span><span class="sy0">;</span>
            $<span class="br0">&#40;</span><span class="st0">'#message'</span><span class="br0">&#41;</span>.<span class="me1">val</span><span class="br0">&#40;</span><span class="st0">''</span><span class="br0">&#41;</span><span class="sy0">;</span>
        <span class="br0">&#125;</span><span class="br0">&#41;</span><span class="sy0">;</span>
    <span class="br0">&#125;</span><span class="br0">&#41;</span><span class="sy0">;</span>
<span class="br0">&#125;</span><span class="br0">&#41;</span><span class="sy0">;</span></pre></td></tr></table></div>

<p>So, when we click the submit button, the javascript will take the value of input textbox then send it to <code>message/add</code> using post method. When the action succeed, the script will call <code>message/view/ajax</code>. Note the <code>ajax</code> keyword. It will call the <code>message_list</code> view instead of the default one. Then the view will replace the content in <code>div#content</code> tag.</p>
<p>Well done. You could see <a href="http://sandbox.littlebrain.org/ci/index.php/message/view">the demo I made from the tutorial</a>.</p>
<p>You could download the whole files used in this tutorial in <a class="downloadlink" href="http://littlebrain.org/wp-content/plugins/download-monitor/download.php?id=1" title=" downloaded 3388 times" >tutorial.zip (1.98 KB)</a>.</p>
<p>Or, if you prefer to get one by one,<br />
<a class="downloadlink" href="http://littlebrain.org/wp-content/plugins/download-monitor/download.php?id=2" title=" downloaded 1014 times" >controller: message (904 bytes)</a><br />
<a class="downloadlink" href="http://littlebrain.org/wp-content/plugins/download-monitor/download.php?id=3" title=" downloaded 768 times" >model: message model (583 bytes)</a><br />
<a class="downloadlink" href="http://littlebrain.org/wp-content/plugins/download-monitor/download.php?id=4" title=" downloaded 974 times" >view: default (782 bytes)</a><br />
<a class="downloadlink" href="http://littlebrain.org/wp-content/plugins/download-monitor/download.php?id=5" title=" downloaded 854 times" >view: message_list (111 bytes)</a></p>
<p>I hope this tutorial helps newbie like me. If you have any question, just drop a comment below <img src='http://littlebrain.org/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://littlebrain.org/2008/05/27/codeigniter-and-ajax-using-jquery-tutorial/feed/</wfw:commentRss>
		<slash:comments>68</slash:comments>
		</item>
	</channel>
</rss>
