Recently, I’ve been getting a lot of comments on my blog post ExtJS 4: Combo Boxes, loadRecord() and Remote Stores that have offered some really great feedback including a lot of suggestions for changes that should be made. Unfortunately, I haven’t had the time to integrate any of the suggested fixes. At the same time, I don’t like having code that doesn’t work quite right and help the community.

To alleviate this problem, I’ve create a GitHub Account and created a repository just for the code snippets I put on this site. I encourage you to take a look at what I’ve got in there (more will be added soon) and see if you can make any improvements. Feel free to fork, comment and commit to your heart’s content. I’d really appreciate it.

Thanks again for all of your comments and support. I look forward to seeing what you can do!

I wrote this method a few weeks ago and though I’d share it. It parses ExtJS filters sent in by the FilterFeature.

<?
function parseExtJSFilters() {
    if(!isset($_GET['filter') { // No filter passed in
        return FALSE;
    }
    $filters = json_decode($_GET['filter']); // Decode the filter
    if($filters == NULL) { // If we couldn't decode the filter
        return FALSE;
    }
    $whereClauses = array(); // Stores whereClauses
    foreach($filters as $filter) {
        switch($filter->type) {
            case 'boolean':
                $filter->value = ($filter->value === TRUE) ? '1' : '0'; // Convert value for DB
                $whereClauses[] = "$filter->field = $filter->value" ;
                break;
            case 'date':
                $filter->value = "'$filter->value'"; // Enclose data in quotes
            case 'numeric':
                switch($filter->comparison) {
                    case 'lt': // Less Than
                        $whereClauses[] = "$filter->field < $filter->value";
                        break;
                    case 'gt': // Greather Than
                        $whereClauses[] = "$filter->field > $filter->value";
                        break;
                    case 'eq': // Equal To
                        $whereClauses[] = "$filter->field = $filter->value";
                        break;
                }
                break;
            case 'list':
                $listItems = array();
                foreach($filter->value as $value) {
                    $listItems[] = "'$value'";
                }
                $whereClauses[] = "$filter->field IN(" . implode(',', $listItems) . ')';
                break;
            case 'string':
            default: // Assume string
                $whereClauses[] = "(
                    $filter->field LIKE '{$filter->value}%' OR
                    $filter->field LIKE '%{$filter->value}' OR
                    $filter->field LIKE '%{$filter->value}%' OR
                    $filter->field = '{$filter->value}'
                )";
                break;
        }
    }
    if(count($whereClauses) > 0) {
        return implode(' AND ', $whereClauses);
    }
    return FALSE;
}
?><?
function parseExtJSFilters() {
    if(!isset($_GET['filter') { // No filter passed in
        return FALSE;
    }
    $filters = json_decode($_GET['filter']); // Decode the filter
    if($filters == NULL) { // If we couldn't decode the filter
        return FALSE;
    }
    $whereClauses = array(); // Stores whereClauses
    foreach($filters as $filter) {
        switch($filter->type) {
            case 'boolean':
                $filter->value = ($filter->value === TRUE) ? '1' : '0'; // Convert value for DB
                $whereClauses[] = "$filter->field = $filter->value" ;
                break;
            case 'date':
                $filter->value = "'$filter->value'"; // Enclose data in quotes
            case 'numeric':
                switch($filter->comparison) {
                    case 'lt': // Less Than
                        $whereClauses[] = "$filter->field < $filter->value";
                        break;
                    case 'gt': // Greather Than
                        $whereClauses[] = "$filter->field > $filter->value";
                        break;
                    case 'eq': // Equal To
                        $whereClauses[] = "$filter->field = $filter->value";
                        break;
                }
                break;
            case 'list':
                $listItems = array();
                foreach($filter->value as $value) {
                    $listItems[] = "'$value'";
                }
                $whereClauses[] = "$filter->field IN(" . implode(',', $listItems) . ')';
                break;
            case 'string':
            default: // Assume string
                $whereClauses[] = "(
                    $filter->field LIKE '{$filter->value}%' OR
                    $filter->field LIKE '%{$filter->value}' OR
                    $filter->field LIKE '%{$filter->value}%' OR
                    $filter->field = '{$filter->value}'
                )";
                break;
        }
    }
    if(count($whereClauses) > 0) {
        return implode(' AND ', $whereClauses);
    }
    return FALSE;
}
?>

You can view examples of using the FilterFeature in ExtJS 4 on the ExtJS 4 examples page for grid filtering.

Update: The source code for this snippet is available here.

A while back I ran into an interesting issue regarding loading records from the database into a form that contained combo boxes driven by remote stores. The problem was, when the record got loaded into the form, the stores for the combo boxes hadn’t loaded, so all the combo boxes said “select one” instead of the option that was chosen when the form got submitted. After doing some digging, I came up with a way around this issue: Read more

When setting up a controller in ExtJS 4, you might do something like this:

Ext.define('app.controller.myController', {
    init: function() {
        this.control({
            'form > textfield': {
                change: this.textFieldChange
            }
        })
    },
    textFieldChange: function(textField, newValue, oldValue, options) {
      alert('The text box went from' + oldValue + ' to ' + newValue);
    }
});

What this code is saying is “Find every textfield inside of the form in the current view (usually the viewport) and, whenever the value changes, fire the textFieldChange method”. Now, this is fine and all, but what if your textFieldChange method sent a request to the server? That would mean that, for every character you typed, a new request would be created and sent to the server causing a lot of unnecessary overhead. Read more

Recently, I started using Twitter’s native iPhone app. Overall, I really enjoy it, but there’s one thing about it that drives me just nuts: The settings screen(s). Read more

When I began using the SuperBoxSelect plugin at work, things went from good to awesome pretty damn quick. SuperBoxSelect offers a lot of great features that standard combo boxes don’t as well as directly integrating with the rest of ExtJS so you can do cool things like tie them to a JsonStore and write custom event handlers. Unfortunately, this plugin does support a commonly used feature among standard combo boxes: Shift+Click Selection. Read more

Recently, I was working on a side-project that involved allowing the user to press play and listen to a sample track from a list of tracks on their iPhone. While this functionality works great when the user is on WiFi, the delay between pressing ‘Play’ and hearing the song on a 3G connection makes the application feel sluggish and non-responsive. My first idea was to add an event listener to the ‘play’ event (or something similar) and show / hide some sort of loading message when the user selects ‘play’. Unfortunately, the Sencha Touch API doesn’t support any such event. However, there is a way around this. Read more

When you post a Tweet, it get’s timestamped with something like “posted 20 minutes ago”. If you’d like to replicate this behavior in PHP, here’s a function you can use: Read more