About mikedfunk

Web developer.

Remote Config Files In CodeIgniter

I ran into a situation recently where I had multiple CodeIgniter apps which depended on the same config values. No problem, right? Just use a common third_party folder. That would work, except they were on different servers! My solution was to echo the config as JSON in one place, grab the JSON in other apps and load them as config values. Now you can do the same!

Setup

  1. Install sparks at GetSparks.org
  2. Install the curl_load spark

Usage

First, do this in your config file:

<?php // DON'T put the usual !defined(BASEPATH) part up here
 
$config['this_key'] = 'value';
$config['that_key'] = 'value';
 
// if it's not loaded by CodeIgniter, echo it as JSON so
// we can grab the keys/values remotely
if (!defined(BASEPATH)) echo json_encode($config);

Now in your controller, use the curl_load spark to load the config file:

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
 
class test_controller extends CI_Controller
{
    public function index()
    {
        // replace x.x.x with version number
        $this->load->spark('curl_load/x.x.x');
 
        $this->curl_load->load_config('http://example.com/path/to/config.php');
    }
}

If you need to secure the values of the config file, you can add optional http authentication credentials:

$this->curl_load->load_config('http://example.com/path/to/config.php', 'http_auth_username', 'http_auth_password');

Or you could load an array of config files:

$this->curl_load->load_config(
    array(
        array(
            'url' => 'http://url1.com/config.php'
        ),
        array(
            'url' => 'http://url2.com/config.php',
            'username' => 'optional_http_auth_username',
            'password' => 'optional_http_auth_password'
        )
    )
);

Last but not least: You can set it to autoload config files in

config/curl_load.php
. Just add your config files in the same array format as above:

$config['curl_autoload'] = array(
    array(
        'url' => 'http://url1.com/config.php'
    ),
    array(
        'url' => 'http://url2.com/config.php',
        'username' => 'optional_http_auth_username',
        'password' => 'optional_http_auth_password'
    )
);

This is really cool, especially when you autoload the spark as well. Then your config values will automatically be loaded without you having to do anything!

$autoload['sparks'] = array('curl_load/x.x.x');

If this helps you, leave me a comment. Have fun!

IE Multiple Submit Buttons Bug

I ran into a nasty bug recently that was totally unexpected. I had a form that needed to be submitted to multiple possible locations such as submit item and save draft. I am trying to chill on JQuery overuse lately so I Googled a solution for this. Turns out I'm in luck! You can have multiple submit buttons with the same name but different values. Whichever one you click will be submitted, while the other won't. Yay!

So I thought.

Unfortunately, if you Google "multiple submit buttons" and open an article, most of them don't mention a nasty IE 6-7 bug where this simple process fails silently. It's not a CSS bug. It's not a javascript bug. It's a bug in the way IE handles submit events, and it sucks.

Here's an example form. It just submits to itself and displays the value of the "action" button submitted. Check the source:

Give it a try yourself and see what happens. Try it in IE6, IE7, then in a modern browser. Go ahead, I'll wait. In case you don't have these installed, here's IE6:

IE6

and here's IE7:

IE6

In both IE6 and IE7, It treats buttons strangely. It submits the text between the button tags rather than the value of the button. WTF? On top of that, IE6 just submits the value as the last submit button in the source order with that name, no matter which button you click. WTF! At least it seems to work as expected in IE8 and IE9.

So how do we fix it? With some JQuery duct tape.

First we strip the name and value attributes of the buttons. Retard IE can't figure them out. We'll replace them with some twitter bootstrap style metadata:

<button data-value="value one" class="btn" type="submit">Submit One</button>
<button data-value="value two" class="btn" type="submit">Submit Two</button>

Then we add a hidden input for the action. We set a default value so the enter key will still work:

<input type="hidden" name="action" value="one" />

Then we add some simple jquery to the top:

<script type="text/javascript">
    $(function()
    {
        // on clicking one of the submit buttons
        $('button').click(function()
        {
            // get the data-value and assign it to the hidden action field
            var submit_val = $(this).attr('data-value');
            $('[name="action"]').val(submit_val);
        });
 
        // form submit, just to allow js to set the value before submitting
	    $('form').submit(function(e)
	    {
	    	e.preventDefault();
	    	$(this).unbind('submit').submit();
	    });
    });​
</script>

Now we're all set! The click event always fires before the submit event, even in IE6. It sets the value of the hidden input and submits the form. Here's our working file:

Check it out, it's working!

Query Strings in CodeIgniter

CodeIgniter really does not like query strings. It's just downright mean.

  1. $this->uri->uri_string() removes the query string. Why?
  2. current_url() from the url helper removes the query string. Why?
  3. You can use query strings instead of segment-based urls such as http://example.com?c=controller_name&m=method_name instead of http://example.com/controller_name/method_namebut they have a nasty warning:

If you are using query strings you will have to build your own URLs, rather than utilizing the URL helpers (and other helpers that generate URLs, like some of the form helpers) as these are designed to work with segment based URLs.

Not a good deal! Plus there are no built-in helpers or libraries to grab the query string and do stuff with it.

But why use query strings at all? I thought segments were better?

  1. Unlike URI segments, query string segments are all optional. If you have 5 key/value pairs, you can include just items 1 and 5 if you want.
  2. Unlike URI segments, query string segments can be put in any order. If you have the same 5 items you can order them like 4,5,3,1,2 if you want.

These are big deals, because they are a giant pain in the ass with segments. For instance, let's say you have 5 segments and you just want to change segment 5 from the default. You have to send the default values for segments 1-4 first! So your url ends up looking something like this:

http://example.com/1/true/false/0/fifth_segment 

Looking at that url it makes no sense. You don't know what 1, true, false, or 0 refer to. But you are forced to type them all. What happens if one of these default values change? Or if the order changes? Or if you have to add or remove a segment? You have to change all your URLs! What a pain in the ass!!

Now segment-based urls are fine for hierarchical websites such as /products/outdoor/chainsaws/12. But for web applications, they totally suck. The way I see it there are two possible ways to fix this in CodeIgniter. You can either extend the URI and URL classes or write a new helper/library. I chose not to mess with URLs and just create a helper so I could use it in a view by just calling a function without $this->helper_name-> in front. So here's my query_string_helper:

Query String Helper
Download

It has just two functions:

  1. query_string($add, $remove, $include_current)This just echoes the query string with no params.
    1. Param 1 allows you to add an array of items to the query string.
    2. Param 2 you can either send a string of a key you want to remove or send an array of keys you want to remove.
    3. Param 3 lets you ditch the current query string if you want and just make a new one.
  2. uri_query_string( same params as above ) This includes the full current uri with the query string on the end. It allows you to manipulate the query string in the same ways as above.

Now you can just replace all your $this->uri->uri_string() or current_url() calls with uri_query_string() and you're good to go!

Getting CIUnit to work with Sparks

I recently got bit by the Sparks bug again. If you don't know, Sparks is like CodeIgniter's version of Ruby Gems. It's a command-line-based package manager that lets you install stuff for CodeIgniter quickly and keep it up-to-date. It's a great idea and I want to port my libraries over to this system.

So I thought I'd try to get Kenji's CIUnit working with Sparks. His wiki says to just change one line in MY_Loader.php (which is created by Sparks) and you're good to go. I found this to not be the case, so I did a little digging. Here's what you need to do to get them to play nice together:

If you haven't already, start by installing Sparks.

In application/core/MY_Loader.php change this:

define('SPARKPATH', 'sparks/');

to this:

define('SPARKPATH', APPPATH . '../sparks/');

Then in application/third_party/CIUnit/core/CIU_Loader.php change this:

class CIU_Loader extends CI_Loader {

to this:

class CIU_Loader extends MY_Loader {

Then you should be good to go. CD back to your root/tests in the terminal and hit phpunit. If you've loaded sparks, they should now work without erroring out. Huzzah!

console.log() and Internet Explorer

The Problem

I use console.log() in javascript all the time for debugging. It's a great way to display errors without printing them on the screen. Sometimes I forget to delete them all before deploying live code. Come to find out that if even one console.log exists in your javascript, IE will stop dead when they see it and throw a small javascript error. They do not understand console.log unless the F12 developer tools are open.

One thing to keep in mind is that console.log will actually work if you have the IE developer tools window open, even if it's minimized to the bottom of the IE window. It will even work if you open the developer tools and completely close them. So everything will seem fine, but when a customer visits the site in IE7, they will run into errors. (IE7 does not include developer tools but they can be installed as an add-on) This is a huge problem!

The Solution

Fortunately solutions exist for this, courtesy of Arlo Carreon. You could of course remove all console.log method calls for production code, which you should do. But what if you forget one? That's where this solution comes in. Declare this function at the top of your JS:

var console = console || {
    log:function(){},
    warn:function(){},
    error:function(){}
};

This will replace the console object in IE with empty methods for the usual console commands. No more javascript errors! I highly recommend you put this at the top of ALL of your custom javascript code. Now if only Microsoft would patch IE to allow for console.log() to fail silently if developer tools are not open!

New open source CodeIgniter projects

I've made some open source projects available on GitHub:

CI Alerts - A CodeIgniter package to save and display different types of alerts. It wraps alerts with html based on the type of alert.

CI Authentication - A CodeIgniter authentication package for complete authentication management.

Carabiner - a fork of Tony Dewan's Carabiner library. This version also accepts and compiles .less files.

Base CodeIgniter App - a preconfigured codeigniter app with some useful submodules such as carabiner, authentication, twitter bootstrap, and PHPUnit.

Bookymark - a sample CodeIgniter app using all of the above libraries, general CodeIgniter best practices, and fully unit tested. Example app is live on bookymark.com.

I hope this will help you develop CodeIgniter apps more easily!