getElementById is not working in fire fox

For hidden fields the following code will not work in firefox
document.getElementById("AttachName").value = fname;
it should be
document._frmUpload.AttachName.value = fname;
Here _frmUpload is the form name.
AttachName is field ID.
So better use the second one if you know the form name.

Flex Pie Chart using XML as data source

Pie Chart in flex using XML as dataprovider for piechart

The XML format should be as shown below.

<?xml version="1.0" encoding="utf-8" ?>
<items>
<item name="option1" number="2000" />
<item name="option2" number="9000" />
<item name="option3" number="5000" />
<item name="option4" number="7000" />
</items>

The Flex application code is shown below.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:HTTPService id="dataRequest" url="" showBusyCursor="true" fault="dataRequestFaultHandler(event);" />
<mx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
import mx.controls.Alert;
import mx.collections.ArrayCollection;
public function initApp():void {
var timeStampForNocache:Date = new Date() ;
var urlAgent:String = "Your XML returing URL PATH & tim=" + timeStampForNocache.toString();
dataRequest.url = urlAgent;
dataRequest.send();
}
[Bindable]
private var stats:ArrayCollection;

private function dataRequestFaultHandler(event:FaultEvent):void {
Alert.show(event.fault.message);
}
]]> </mx:Script>
<mx:PieChart width="100%" height="100%" showDataTips="true" dataProvider="{dataRequest.lastResult.items.item}" id="myChart">
<mx:series>
<mx:PieSeries width="100%" height="100%" field="number" nameField="name" />
</mx:series>
</mx:PieChart>
<mx:Legend direction="horizontal" dataProvider="{myChart}"/>
</mx:Application>

The result would be like the below image.

Flex Column Chart using XML as source

Column Chart in flex using XML as dataprovider for column chart

The XML format should be as shown below.
<items>
<item>
<name> Test1 </name>
<number> 1000 </number>
</item>
<item>
<name> Test1 </name>
<number> 1000 </number>
</item>
<item>
<name> Test1 </name>
<number> 1000 </number>
</item>
<item>
<name> Test1 </name>
<number> 1000 </number>
</item>
</items>
The Flex application code is shown below.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()">
<mx:HTTPService id="dataRequest" url="" showBusyCursor="true" result="dataRequestResultHandler(event);" fault="dataRequestFaultHandler(event);" />
<mx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
import mx.controls.Alert;
import mx.collections.ArrayCollection;
public function initApp():void {
var timeStampForNocache:Date = new Date() ;
var urlAgent:String = "Your XML returing URL PATH & tim=" + timeStampForNocache.toString();
dataRequest.url = urlAgent;
dataRequest.send();
}
[Bindable]
private var stats:ArrayCollection;
private function dataRequestResultHandler(event:ResultEvent):void {
stats = event.result.items.item;
}
private function dataRequestFaultHandler(event:FaultEvent):void {
Alert.show(event.fault.message);
}
]]> </mx:Script>
<mx:ColumnChart id="xmlChartBar" dataProvider="{stats}" showDataTips="true" width="500">
<mx:horizontalAxis>
<mx:CategoryAxis dataProvider="{stats}" categoryField="option"/>
</mx:horizontalAxis>
<mx:series>
<mx:ColumnSeries showDataEffect="fadeIn" xField="name" yField="number" displayName="Hits" />
</mx:series>
</mx:ColumnChart>
</mx:Application>
The result would be like the below image.

Quiz result page - Quiz application in flex

As i have mentioned in the previous post, developed quiz application result page.

Here is the sreen shot. As it is not fully completed, i am not posting the source code.


Navigation to all the quiz questions is shown below.


Once it is completed, then i will post the code to download.

MEANWHILE IF YOU WANT THE CURRENT VERSION AS IT IS, PLEASE LEAVE YOUR MAIL ID IN COMMENTS SECTION, TO MAIL THE SOURCE CODE.

IE is losing ClearType if you use jQuery hide or fadeIn

IE is losing ClearType if you use jQuery hide/show or fadeIn/fadeOut or even when you open a remote page.

$('#myDiv').hide();

$("#myDiv").fadeIn('slow');


The problem seems to be that the CSS "filter" attribute is not automatically removed. The most simple solution to this problem would be removing it manually :)


$('#myDiv').fadeIn('slow', function() {
this.style.removeAttribute('filter');
});

But the above solution looks odd because for each hide you need to remove manually.

A simple, more elegant solution would be to wrap the .fadeIn() and .fadeOut() functions with a custom function via the plugin interface of jQuery. The code would be exactly the same, but instead of directly calling the fade functions, we call the wrapper.

$('#node').customFadeOut('slow', function() {
//no more fiddling with attributes here
});

So, how do you get this working? Just include the following code after you include the jQuery library for the added functionality.

(function($) {
$.fn.customFadeIn = function(speed, callback) {
$(this).fadeIn(speed, function() {
if(jQuery.browser.msie)
$(this).get(0).style.removeAttribute('filter');
if(callback != undefined)
callback();
});
};
$.fn.customFadeOut = function(speed, callback) {
$(this).fadeOut(speed, function() {
if(jQuery.browser.msie)
$(this).get(0).style.removeAttribute('filter');
if(callback != undefined)
callback();
});
};
})(jQuery);


Bug in Lotus 8.5.1 ? jQuery script is giving error while saving in Lotus 8.5.1 script library as javascript code

jQuery script is giving error while saving in Lotus 8.5.1 script library as javascript code.

Error screen shot:


Is that problem with jQuery (i dont think). This could be a problem with Lotus 8.5.1 javascript script library.

What do you think?

Have you used jQuery facebox in your application?

Facebox is a fantastic tool to display small information in pop up style.

The code is very simple. This is effectively working in Lotus Domino.

The below image shows how the facebox looks.


Click Here to see more information on this.

Do you want to copy css of a particular element in any site.. Its easy..

Do you want to copy css of a particular element in any site.. Its easy now with Mozilla Firefox.

All you need to do is

1. Download firefox (if you do not have).

2. Install WebDeveloper add on as shown in below image.



3. Goto CSS tab in web developer toolbar and select View CSS Information as shown below.


The below figure shows the CSS for Signup button in twitter. CSS displayed in the Right side bar.


It is so simple right?