Yii » Missing Features

This will be an ongoing list. Check back in the future.

1. Yii needs a grid that you can edit inline - maybe jqgrid for version 2?
2. The listData->groupField works nicely on dropDownLists, but it would be nice it it worked on checkBoxLists and radioButtonLists too (displaying the category name and indenting associated controls)
3. No concurrency control. It would be nice in Gii if it could generate models that saved the original record values, as well as using them to check for concurrency when saving. 
4. Easier to use some of the new HTML 5 controls, like "search"
5. Built-in basic search on lists (much like on grids)
6. Easier tabular input
7. When you do ajax on a grid (sort or page), it reloads the whole page, finds the grid content, and replaces itself. This is a little inefficient ;) . It would be better if Gii could split the grids out to separate partial views. 
8. Yii seems to get confused sometimes when you have nested JQuery UI controls
9. It would be better if the built-in Blueprint theme was mobile-friendly out of the box, and by that I mean side by side columns that collapse on top of each other on small width screens, perhaps switch to the 1140 grid system. 
10. use superfish on multi-level menus out' the box
11. ZeroClipboard, jQuery WYSIWYG editor, and fullcalendar support out' the box.
12. phpMailer, a flash/html5/silverlight multi-uploader, vcard, pdf, ics support out' the box

How to hide the url address bar on a web page on Blackberry

Here's how to minimize the url address bar in a web page on a blackberry (blackberry 6 anyways).

Put this script at the bottom of the page, or call it ondocumentready:

if(navigator.userAgent.toLowerCase().indexOf('blackberry')>0)window.scrollTo(0,40);

It causes the browser to scroll down 40 pixels, which essentially makes the browser bar hide itself.

How to make vCard QR Codes that are compatible with iPhone, Android and Blackberry

I've been working on a web page where you can scan a company's vCard easily on your smartphone and have it saved to your contact list. It's definitely a pain in the ass. Here is a sample QR code with a vCard in it:



Here are some tips:

• use the Image Chart Editor on Google Code - you have to look for the QR Code chart in the gallery. Basically, you send it a URL with the vCard in the querystring and it sends back a QR Code image. Don't forget to url-encode your querystring. 
• You don't need to email a vCard to iPhone, it can read them directly from a QR Code with the right app.
• I tried a few different QR Code readers for iPhone and most of them sucked at parsing vCards. The best that i found was Qrafter, and it's free.
• I used Barcode Scanner on Android. 
• Android didn't want to accept a URL, so I put it in the NOTE as well. Any tips?
• With Blackberry 6, use AppWorld, hit the menu, then choose Scan a barcode. 
• Blackberry can't read vCards directly from a QR Code, but you can qr-code a URL that returns a vCard. You'll want to send back this PHP header: header("Content-type:text/x-vcard");

Young, bored, and know Java? Please write a decent QR code reader for blackberry :)

Here is a vCard that I tested with Windows 7, Blackberry 6, iPhone 4 and Android 2.3.3

How to implement simple and easy search functionality on an index page

Here's how to implement simple and easy search functionality on an index page:

1. Let's say your controller looks like this:

public function actionIndex()
{
  $dataProvider=new CActiveDataProvider('Model');
  $this->render('index',array(
  'dataProvider'=>$dataProvider,
  ));
}

2. Change it to this:

public function actionIndex()
{
    $criteria = new CDbCriteria();

    if(isset($_GET['q']))
    {
      $q = $_GET['q'];
      $criteria->compare('attribute1', $q, true, 'OR');
      $criteria->compare('attribute2', $q, true, 'OR');
    }

    $dataProvider=new CActiveDataProvider("Model", array('criteria'=>$criteria));

    $this->render('index',array(
      'dataProvider'=>$dataProvider,
    ));
}

The above will read in the "q" (for query) parameter, and use the compare function to create the sql to search a few attributes for that value. Note the use of the 'OR' operator.

3. In your index view, add this:

<form method="get">
<input type="search" placeholder="search" name="q" value="<?=isset($_GET['q']) ? CHtml::encode($_GET['q']) : '' ; ?>" />
<input type="submit" value="search" />
</form>

The above creates a form that will submit to itself using the querystring. It displays a search input box, which is a text input box with a "cancel" command. It works in most browsers and defaults to a text field in the rest. When the user hits the search button, the form is submitted and the data is filtered by the search value.

How to hide index.php in the url in a Yii website

to hide "index.php" from the url on a website, add an .htaccess file to your web root, with this text:

Options +FollowSymLinks
IndexIgnore */*
RewriteEngine on

# if a directory or a file exists, use it directly
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

# otherwise forward it to index.php
RewriteRule . index.php

and in /protected/config/main.php, set:


'urlManager'=>array(
'urlFormat'=>'path',
   'showScriptName'=>false,
   'caseSensitive'=>false,

Adventures in CSS: a seal of approval

Here's how to make a nice "seal of approval" using only cascading style sheets. This only works in REAL browsers for now (webkit/firefox), but there are other options for IE

Approved!

it should look like this image:

Here we have a simple div tag:

<div class="seal">Approved!</div>

And we apply some css styles to it:

1. to make it a circle, apply border-radius:50%;
2. to rotate the div, use -webkit-transform: rotate(20deg);
3. give the background a nice radial gradient with: -webkit-gradient(radial, 50% 0%, 1, 50% 0%, 200, from(#B00000), to(#600000));
4. give it a subtle shadow with: box-shadow: 2px 2px 2px gray;

Here's the full CSS:



.seal
{
    height:200px;
    width:200px;
    text-align:center;
    color:white;
    font-family:Trebuchet MS;
    font-size:xx-large;
    line-height:200px; /*center text vertically*/
    background-color:#600000; /*fallback for other browsers*/

    border-radius:50%;
    -moz-border-radius:50%;

    -webkit-transform:rotate(20deg);
    -moz-transform: rotate(20deg);

    background: -webkit-gradient(radial, 50% 0%, 1, 50% 0%, 200, from(#B00000), to(#600000));
    background: -moz-radial-gradient(50% 0%, cover, #B00000, #600000);

    box-shadow: 2px 2px 2px gray;
    -moz-box-shadow: 2px 2px 2px gray;
}

How to override Yii's block radio button list labels and make them inline

By default, Yii radio buttons, radiobuttonlists, and checkboxlists look dumb. The label is on a different line, which is not a great design.

Here's how to fix it:

In your form style sheet (form.css), set:

input[type=radio] + label, input[type=checkbox] + label { display:inline !important; }

that's it, you're done.

What it does is says anytime you have a radio button with a label element directly after it, make that label inline instead of block, meaning that there won't be a line break.

I would also recommend changing Yii's default checkbox label positioning to before the label.