Step By Step Cross Domain Pass Parameter

Objective of this tutorial is helping those who want to create api but having the issue of cross domain problem.

How to Create Client Call API
Step 1:
Create javascript file name myjsfile.js and paste the following codes.

$(function(){
  $('#btn_name').on('click', function(e){
    $.getJSON("http://www.yourotherdomain.com/myapifile.php?jsoncallback=?",
    {
      variable1: "maybe textbox value",
      variable2: "maybe textbox value",
      variable3: "maybe textbox value"
    },
    function(data) {
        var str = data['result'];
        alert(str);
    });
  });
});

Step 2:
Include the following code before </head> tag.

<script src="js/myjsfile.js" type="text/javascript"></script>

You are now able to pass parameter to function from difference domain http://www.yourotherdomain.com/myapifile.php  .


How to Create Server Response
Step 1:
Create php file name myapifile.php and paste the following codes.

<?php

 header("Content-Type: application/json, charset: utf-8;");
 $arr=array();
 $arr['result'] = "Here is your result data";
 echo $_GET['jsoncallback'].'('.json_encode($arr).');';
 exit;

?>

~End~

Notice:
You may get Uncaught SyntaxError: Unexpected token if you did not include $_GET['jsoncallback'].

References:
http://stackoverflow.com/questions/3143698/uncaught-syntaxerror-unexpected-token
http://www.w3resource.com/JSON/JSONP.php

PROGRAMMING TOOLS

Well, this is for my own references as people tend to forget many things when they're getting older. : D

System Analysis and Design Tools

1. Pencil
2. MySQL Workbench

Coding and Development

1. Sublime Text 2
2. Notepad ++
3. MySQL
4. TortoiseSVN

FTP Uploader

1. Filezilla

Online Testing Tools

1. http://sqlfiddle.com/
2. http://jsfiddle.net/
3. http://regex101.com/
4. https://www.functions-online.com/preg_match.html
5. http://writecodeonline.com/php/
6. http://www.bootply.com/
7. http://putsmail.com/
8. http://phpfiddle.org/

Bootstrap

1. http://charliepark.org/bootstrap_buttons/
2. http://fontawesome.bootstrapcheatsheets.com/
3. To help you decide which to use http://tagliala.github.io/vectoriconsroundup/#angle-up

Allow Phone Access to Localhost

1. fiddler2 : To enable connection between mobile device and localhost device, you must change mobile device's proxy ip to follow localhost device connection ip. Port number in mobile device should be same as port number in fiddler setting.

Welcome for more tools sharing.

Opening new window/tab without using `window.open` or `window.location.href`

Answer from stackoverflow.com:

What it does:

1. Create a form
2. Give it attributes
3. Append it to the DOM so it can be submitted
4. Submit it
5. Remove the form from the DOM

Now you have a new tab/window loading "https://google.nl" (or any URL you want, just replace it). Unfortunately when you try to open more than one window at once this way, you get an Popup blocked messagebar when trying to open the second one (the first one is still opened).

Source Code:

var form = $("<form></form>");
form.attr(
{
    id     : "newform",
    action : "https://google.nl",
    method : "GET",
    target : "_blank"        // Open in new window/tab
});

$("body").append(form);
$("#newform").submit();
$("#newform").remove();

Yii: Step by Step Create Custom Component

Setup Component:

1. Create new class file in protected/components/Beauty.php
2. Start with the following code in Beauty.php

<?php
class Beauty extends CApplicationComponent
{
     public function makeup(){
        $colorbox = 'blue';
        return $colorbox;
     }
}
?>

3. Go to protected/config/main.php and add the following line under components:

'components'=>array(
   'beauty' = array (
            'class' => 'application.components.Beauty';
              ),
),


How to use it in controller:

1. In controller file:

<?php
  class FashionController extends Controller{
        //call beauty component;
       $beauty = Yii::app()->beauty;
       $color = $beauty->makeup();
       
        // output is blue;
        echo $color
  }
?>

Yii: Step by Step Working with CFile Extension

CFile extension is commonly used for filesystem objects (files or directories) manipulate. The following step will show you how to config till how to use it.

Setup
1. Click on -> CFILE and download the folder.
2. Unzip and copy the folder in to protected/extensions path
3. Rename the folder to file
4. Add the following code into protected/config/main.php

'components'=>array(
    'file' => array(
        'class' => 'application.extensions.file.CFile',
     ),
 ),

How to Use
// yourfile
$yourfile = 'sample.txt';

// Call extension into $cfile variable
$cfile = Yii::app()->file;

// Check file exist
$cfile->set($yourfile)->exists;

// Create file
$cfile->set($yourfile)->create();

// Append Content
$cfile->set($yourfile)->setContents('treat me a coffee for this tutorial!');

// Get Content from file
$cfile->set($yourfile)->getContents();

// Delete File
$cfile->set($yourfile)->delete();


Others available method as follow:

• Create
• CreateDir
• Purge
• Contents (get; set for files, append possible; contents filters for directories)
• Copy
• Rename/Move
• Send/Download ('x-sendfile' header support)
• Delete

The properties of file you can check as follow:

• exists
• isdir
• isfile
• isempty
• isuploaded
• readable
• writeable
• realpath
• basename (setter available)
• filename (setter available)
• dirname
• extension (setter available)
• mimeType
• timeModified
• size
• owner (setter available)
• group (setter available)
• permissions (setter available)

Yii: Step By Step Create Yiic Console Command Line

This is interesting part in Yii that I like, we can create our own yiic console application to run our function.
http://www.yiiframework.com/doc/guide/1.1/en/topics.console#creating-commands

Step 1: Create Command Class File in path protected/command/shell/commands
class Commands extends CConsoleCommand  {  
    public function actionIndex() {
        echo "Possible action : getMember(), ...\n";
    }
    public function actionMember($id="", $status = "") {
       // action activities
    }  
}

Step 2: Set configuration in /protected/config/console.php
'commandMap' => array(
      'foo' => array(
          'class' => 'application.commands.shell.Commands',
      ),
  ),

Step 3: Test your console command

From command prompt, go to directory protected/ and run yiic. You will notice new command that you have created available on the list. To use your command, just type yiic foo --bar=123 --status=active

Jquery Looping Cause "long running scripts"

I have to load array variable into selection box (selectBoxIt plugin). First attempt was using $.each and it cause overhead in jquery, therefore I got error "long running scripts". It has been solved by replace $.each loop method with regular for loop method.

Solution:
$.ajax({
    url: '/GetBar',
    type: 'GET',
    dataType: 'json',
    async: true,
    success: function(data) {
      var selectBox = $("select#Bar").data("selectBox-selectBoxIt");
      var bar = [];
       for (var i=0;i<data.length;i++) {
         bar[i] = {value:data[i]['mdm_id'], text:data[i]['bar']}
       }
       selectBox.add(bar);
    }
  });

But there are more studies about performance among $.each and for loop in jquery, will check out when i free. (http://stackoverflow.com/questions/14808144/each-vs-each-vs-for-loop-in-jquery)