Thursday, July 19, 2012

PHP cURL issue with WAMP Server on Windows 7 (64 bit)

Just installed WampServer (64 bits & PHP 5.3) 2.2E recently on my new PC with Windows 7 Ultimate (64 bits). Initially cURL (php_curl.dll) was not loaded due to some reason.

Tried to enable the extension through wamp manager and, by directly editing the php.ini file, but failed. However after googling for few hours I found a fix. The problem was the curl extension that comes with the WampServer is not compatible with the system.

Here is the fix. Follow this link
http://www.anindya.com/php-5-4-3-and-php-5-3-13-x64-64-bit-for-windows/

Go to "Fixed curl extensions" and download the extension that matches your PHP version.

Extract and copy "php_curl.dll" to the extension directory of your wamp installation.
(i.e. C:\wamp\bin\php\php5.3.13\ext)

Restart Apache

Done!

Many thanks to Anindya for saving my time.

Friday, April 20, 2012

Yii CListView - JavaScript issue after pagination update

Yii CListView is a great tool when you want to show a set of data objects as a list in your web app. Everyone will bet the the most helping feature of CListView is the pagination. Simply you don't need to do anything to get pagination work on your list and even more importantly it's AJAX based. Means pages are loaded with AJAX making your application more interactive and user friendly.

So what's wrong with this amazing tool?

If you have HTML elements that needs to be accessed with JavaScript (more specifically jQuery, MooTools, Prototype or any JavaScript library), to attach some events or alter content dynamically when loading, they will work fine for the first page which is loaded in a normal HTTP request and not on the elements loaded with AJAX.

Let's say you want to attach an event to each list item with jQuery.


// the event handler
function clickHandler(evt) {
    // do something on click event
}

// assume that each item has the class "item" and id of list container is "itemList"
$('#itemList .item').bind('click', clickHandler);

Now, this would work only when you first load the page and the event handler will not be attached to the items loaded with subsequent pages you load with CListView pagination.
In order to deal with this kind of situations CListView provides a built in solution that we can use to attach our event handler to the items loaded with AJAX too. Simply set the afterAjaxUpdate property of CListView in your Yii view file as below.

// a javascript callback function to run when AJAX update is finish
$afterAjaxUpdate = 'function(id, data) { $("#itemList .item").bind("click", clickHandler); }';

widget('zii.widgets.CListView', array(
 'dataProvider'=>$dataProvider,
 'itemView'=>'_view',
 'id'=>'itemList',
 'afterAjaxUpdate'=>$afterAjaxUpdate
)); ?>

This way you may get even complex JavaScript operations done on your list items, that's up to you. Please do not forget to share your experience here, if possible.

Sunday, April 1, 2012

Twine - HTML based static website and documentation generator

Developing a static website or a HTML based documentation for something? Need to let your software users download the docs with the application? Want to use a common template across all the pages of your static website?

Well, this article is intended to help you with some basic but time consuming process of applying a template to an HTML based static website or and HTML based documentation. First think if you are developing a static website or documentation that has to follow the of rules given below.

  • All the files must be HTML files that has the extension .html
  • All the pages should share the same template without using a server side scripting language.
  • Files should be arranged in a folder based hierarchy for enabling easy access.
  • Whole website / documentation should be downloadable by end users for offline usage.
  • When published on the internet page URLs should be search engine friendly (SEO).
  • When browsing each page should contain a breadcrumb path for easy navigation.
  • Page title and description should be unique for each page.
  • Each page should be associated with a unique ID to make it easy to install social network plugins / widgets.
  • Pages should have breadcrumbs automatically generated.
Twine is a such tool that you can use to get all the above things done and generate a nice static website. However this tool is still in it's beta release. I leave it to you to experiment and use it in a creative way.

The GitHub repository is here.

Please don't forget to share your experience here.

Thursday, March 22, 2012

TinyMCE content missing in FireFox 11

You might have encountered this issue if you are still using an older version of TinyMCE. Older versions of TinyMCE are not showing the  content inside the editor in FireFox 11. The editor is working fine in FF10.x. I'm not sure exactly which versions of TinyMCE has this issue. This is the case if you are still using earlier minor versions of Joomla 1.5 for your website. The TinyMCE version comes with Joomla 1.5 early versions does not work properly in FireFox 11.

However if you have ever encounter this problem, try replacing the older version with the latest one of TinyMCE. This will fix the issue at best case (at least it did for me). Of course you might need to check some other places if the update does not work such as JavaScript errors. If you are using Joomla, download the latest version of Joomla and replace the tinymce editor plugin with the one in new Joomla version.

I wish you the best with that ;-)

Please share your experience in comments section below.

Wednesday, March 21, 2012

How to fix the Ripple Emulator white screen

You might also have experienced this issue. The Ripple Emulator sometimes loads with a white blank screen after installing or updated to a newer version. This is a quick tip to solve this issue.
Open the Ripple configuration file. You may find it at C:\Users\Username\AppData\Roaming\Research In Motion\Ripple. Open it in notepad or any plain text editor. Find the following line.
windowContent=index.html
Replace with this:
windowContent=http://developer.blackberry.com/html5/update/rippleui
The issue may be solved. However I expect that RIM would remove this Ripple installer related bug in future.
Reference:
http://supportforums.blackberry.com/t5/Web-and-WebWorks-Development/Ripple-no-work/td-p/1401819/page/3

Monday, March 19, 2012

Refresh jQuery Mobile listview after adding dynamic items in BlackBerry

I had a list that needs to be updated with new items from an AJAX response. List items contain some radio buttons and controlgroups that needs to be rendered as jQuery Mobile components. So I had to use .trigger("create") on the listview just before I refresh the listview. Let me show you the HTML bit.
<div data-role="collapsible" id="approve_tr_itinerary_details_wrapper">
<h3>
Itinerary Details</h3>
<ul data-role="listview" id="approve_tr_itinerary_details">
<li>No itinerary details</li>
</ul>
</div>
<div data-role="collapsible" id="approve_tr_travel_options_wrapper">
<h3>
Travel Options</h3>
<ul data-role="listview" id="approve_tr_travel_options">
<li>No travel options</li>
</ul>
</div>
And how I did the new item creation and appending them to the list.
$.each(items, function(index, item) {
 $("#approve_tr_travel_options").append(
 '<li data-role="list-divider">' + (index+1) + '</li>' +
 '<li>' +
 '<span class="tra-info-label tra-width-40">Name:</span>' +
 '<span class="tra-info-text">' + item.name + '</span>' +
 '</li>' +
 '<li>' +
 '<span class="tra-info-label tra-width-40">Cost:</span>' +
 '<span class="tra-info-text">' + item.cost + '</span>' +
 '</li>' +
 '<li>' +
 '<span class="tra-info-label tra-width-40">Valid though (Date / Time):</span>' +
 '<span class="tra-info-text">' + item.exp_date + '</span>' +
 '</li>' +
 '<li>' +
 '<fieldset data-role="controlgroup">' +
 '<input id="approve_tr_travel_option_' + (index+1) + '_1" name="approve_tr_travel_option_' + (index+1) + '" type="radio" value="1" />' +
 '<label for="approve_tr_travel_option_' + (index+1) + '_1">Preferred</label>' +
 '<input id="approve_tr_travel_option_' + (index+1) + '_2" name="approve_tr_travel_option_' + (index+1) + '" type="radio" value="2" />' +
 '<label for="approve_tr_travel_option_' + (index+1) + '_2">Alternate</label>' +
 '</fieldset>' +
 '</li>'
 );
});
Note the controlgroup and input elements. These need to be converted to jQuery Mobile components. So I used .trigger("create") which did a great job on the BlackBerry (also in the Ripple emulator) but not in the Chrome. Let me show the code I used just after adding new elements to the list.
$("#approve_tr_travel_options").trigger("create");
Chrome needs the listviews to be refreshed to render the newly added items as list items. What works for Chrome is,
$("#approve_tr_travel_options").trigger("create").listview("refresh");
However this method doesn't work on BlackBerry. Which was driving me crazy for two days. After messing with the code for few hours I found a solution for this issue, which can be used to render the listviews in both Chrome and BlcakBerry. Instead of refreshing the listview just below where you add new items do that in the pagebeforeshow event handler. Just see the code below.
$("#approve").live("pagebeforeshow", function(event, data) {
 $(this).find('ul').listview('refresh');
});
The listview will be refreshed just before the page is shown to the user. So what you do when you want to load set of items to a listview in the next page in a page transition is, load the set of list items first with AJAX and append them to the listview and trigger the create event (.trigger("create")) on the list and call the refresh just before you show the page to the user. Hope this helps someone to save some time without going crazy on the same issue, just like me!!

Getting Started

Blogger has changed its look and feel. Surely it made me come back to the platform and write something on my newly created blog.The blog name is n terms, which might seems little strange for many people out there. The letter n is used in mathematics to denote multiple (more than one) terms or occurrences of something. Since I have some mathematical background, the name n terms came in to my mind while looking for a suitable name to introduce myself to the blogging world.

I use n terms having some basic idea in mind. It means that I would talk about many terms or may subjects in my personal blog. Most of them would be related to the computer programming (mostly web development). This is inevitable with a person who spends more than twelve hours a day with HTML, CSS and Javascript.

Hope you don't mind it and pay your attention to the rest of the posts.