First of all I will congratulate you on upgrading to wordpress 3.2.1. Having latest version means your site is updated and safe.

Now coming to the point, some of you might have faced this problem. You create a new page or post and do not want to allow comments on that. So you scroll down but cannot find the discussion box. The box which has 2 checkboxes “Allow comments” and “Allow trackbacks and pingbacks”.

To fix this, look at the top right of your screen for the Screen Options button. Click that and you will see a lot of checkboxes there. Click the Discussion  checkbox and close the screen options. Now scroll to bottom of the page and you will find the box sitting there.

WP3.2.1 has several other options like Custom fields, slug, Author which you can also enable from here.

While coding jQuery or javascript, sometimes we need the tag name of an element. This post will show how you can retrieve the tag name of an element easily using jQuery

We know that each DOM element has a tagName property. We also know that most jQuery methods return jQuery object. Therefore to get the tagName, we need to extract the DOM element from it. This can be achieved in 2 ways.

Method 1: Using get() method of jQuery

jQuery’s get() method returns the collection of DOM elements for a jQuery collection.

Consider the following markup

This is a div

In this case $(‘#firstDiv’) will be the jQuery object for above div. To get tag name for correspoding DOM element use the following

var element = $('#firstDiv').get(0);
var tagName = element.tagName;

Note that get() returns an array, hence 0 based indexes to retrieve elements. Have a look at another example.

paragraph element

    span element

var a = $('#secondDiv').children().get(0); // INPUT
var b = $('#secondDiv').children().get(1); // P
var c = $('#secondDiv').children().get(2); // SPAN

Method 2: Using this

You can also use this to refer to DOM elements as shown in next example. Code below use the same markup for secondDiv.

$('#secondDiv').children().each(function()
{
	var tagName = (this.tagName).toLowerCase();
});

The returned tag names will all be in uppercase. You can use javascript function toLowerCase to make them XHTML compliant i.e. lower case.

Applies to:  simplexml_load_string and simplexml_load_file

Problem : SimpleXML does not parse text inside CDATA tags in an XML.

Consider the XML below:

$str = '';
$str.='some text goes here';
$str.='';

To parse it we use following syntax:

$xml = simplexml_load_string($str);

On printing it outputs:

SimpleXMLElement Object
(
    [childNode] => some text goes here
)

Thats OK. Now the same xml but this time the text is enclosed in CDATA tags.

$str = '';
$str.='';
$str.=''

On printing this gives following output:

SimpleXMLElement Object
(
    [childNode] => SimpleXMLElement Object
        (
        )

)

Yes its empty. This is because SimpleXML does not parse CDATA tags. All data enclosed within CDATA is ignored by SimpleXML parser.

Solution: Set the 3rd parameter to LIBXML_NOCDATA while parsing.

simplexml_load_string(simplexml_load_file too) actually takes 3 parameters.

• The string to parse
• Optional parameter – to return an object of class specified in this parameter. (By default it returns a SimpleXMLElement Object)
• Also optional – libxml parameters can be specified as options. This option provides the solution to our CDATA problem

Provide the 3rd parameter LIBXML_NOCDATA and SimpleXML will consider CDATA nodes as text nodes and will parse them.

$xml = simplexml_load_string($str,'SimpleXMLElement', LIBXML_NOCDATA);

This will output as desired:

SimpleXMLElement Object
(
    [childNode] => some text goes here
)

Please note that using the third parameter requires PHP >=5.1 compiled with libxml.

I will be publishing a new post shortly on how to use SimpleXML to parse xml and extract data.

In my previous post, I discussed how we can change the style and/or css class of any html element by JavaScript. We can take advantage of this feature to add functionality where visibility of elements can be toggled. That means clicking a button will change the state of that element from visible to invisible and vice-versa.

The css property that we will manipulate to achieve this behavior is “display”. Below is the html we will use for the example.

<html>
<head>
<title>Toggle elements</title>
<script type="text/javascript" language="javascript">
</script>
</head>
<body>
<div style="border:2px solid;">
<p><input type="button" onClick="toggleMe('toggleHolmes');" value="Click to toggle"/></p>
<p id="toggleHolmes" style="display:block;">
I consider that a mans brain originally is like a little empty attic, and you have to stock it with such furniture as you choose. A fool takes in all the lumber of every sort that he comes across, so that the knowledge which might be useful to him gets crowded out, or at best is jumbled up with a lot of other things, so that he has a difficulty in laying his hands upon it.<br/>
-Sherlock Holmes (A Study in Scarlet - Part 1,chap. 2)
</p>
</div>
<br/>
<div style="border:2px solid;">
<p><input type="button" onClick="toggleMe('toggleNietzsche');" value="Click to toggle"/></p>
<p id="toggleNietzsche" style="display:block;">
God is dead. God remains dead. And we have killed him. How shall we comfort ourselves, the murderers of all murderers? What was holiest and mightiest of all that the world has yet owned has bled to death under our knives: who will wipe this blood off us? What water is there for us to clean ourselves? What festivals of atonement, what sacred games shall we have to invent? Is not the greatness of this deed too great for us? Must we ourselves not become gods simply to appear worthy of it?<br/>
-"The Madman" (Thus Spoke Zarathustra by Friedrich Nietzsche)
</p>

</div>
</body>
</html>

There are 2 paragraphs with ids “toggleHolmes” and “toggleNietzsche” which contain some text. Above each of them is a button. Onclick of each of those buttons we have called a function toggleMe which accepts the id of the element which is to be toggled as its parameter.
Now include the following JavaScript code between the script tags in above html.

function toggleMe(id)
{
	var element = document.getElementById(id);
	if(element.style.display == "none")
	{
		element.style.display = "block";
	}
	else
	{
		element.style.display = "none";
	}
}

Let us analyze it. Function toggleMe gets the id of element.Here we follow the following steps:
Check whether the display property of element is already set to none.
If it is none we need to change it to block.
Otherwise it is visible and therefore we set it to none.

Now go ahead and click the button. Clicking button will make the respective paragraph visible and hidden alternatively.
In case you are interested these all lines of toggleMe function can be replaced by a single line. The magic of Conditional Operator

element.style.display = (element.style.display == "none") ? "block" : "none";

Above example can be seen in action at http://vijayjoshi.org/examples/toggle.html

JavaScript function parseInt() is used to parse a string and extract the integer from that string.
Therefore if you do parseInt(“200xyz”), it will return 200.
The problem arises when you do the following:

var value = "010";
alert(parseInt(value)); // incorrect: will alert 8

You had expected 10 but what you got is 8.

Weird behavior, you must be thinking.

Actually not.It is a lesser known fact that parseInt actually takes two arguments, second of which is optional.

First argument is the string to parse and second is radix, which can be any one of base 10, base 2, base 8 or others.

If second argument is not given. parseInt does not always assume it to be 10. It parses the string on following assumptions:

• If the string starts with “0″, it assumes the radix to be 8 (octal numbers).
• If the string starts with “0x”, it assumes the radix to be 16 (hexadecimal values).
• In other cases it assumes radix as 10.

In the above case 010 means 8 in the octal number system.
Value in Octal       Value in Decimal
0                           0
1                           1
2                           2
3                           3
4                           4
5                           5
6                           6
7                           7
10                         8
11                         9
12                         10
13                         11
14                         12
15                         13

So, to get integer 10 from string “010″ always specify the base second argument.

var value = "010";
alert(parseInt(value,10)); // correct: will alert 10

So the rule of thumb is :

Always specify the second parameter (radix) to parseInt function in order to get correct value.

From today onwards I am introducing a new category FAQ. It will contain quick solutions and code for common problems developers face daily in javascript and php. Browser compatibility issues specially (Firefox and IE) will also be taken care of.
So here is the first one.

Q) How can I get the difference(number of days) between two dates in javascript?

A) Date and time operations in javascript can be done through the Date object. Default constructor for Date doesn’t take any argument and returns current date.

var aDate = new Date(); // will give current date

To get a specific date, you can provide year, month and day.

var anotherDate = new Date(yyyy,mm,dd);

Take care of the fact that months are from 0-11 i.e. January is 0 and December 11.
Hence, new Date(2008,10,09) is 9th November 2008 not 9th October.
Since there is not any inbuilt function for calculating date difference in javascript, we will use getTime() function. getTime() returns number of milliseconds since midnight of January 1, 1970.
Below is the code

var oneDay = 24*60*60*1000;	// hours*minutes*seconds*milliseconds
var firstDate = new Date(2008,01,12);
var secondDate = new Date(2008,01,22);

var diffDays = Math.abs((firstDate.getTime() - secondDate.getTime())/(oneDay));

What we did is

• we took two dates
• got milliseconds for each using getTime() function
• calculated their difference
• and finally divided the difference with the number of milliseconds in one day

Simple, isn’t it???