Determine the type of an Object in JavaScript

In javascript, all the variables are declared as var. However, sometimes we need to know the type of var to implement your logic. This is how you can determine some of the data types.

//chk if an object is an array or not.
function isArray(obj) {
//returns true is it is an array
    if (obj.constructor.toString().indexOf(“Array”) > -1){
        return true;
    }
    else{
        return false;
    }
}

To get the datatype, do the following:

var boolVal = true;
var numVal = 123;
var strVal = "String";
alert(typeof boolVal)    // displays "boolean"
alert(typeof numVal)     // displays "number"
alert(typeof strVal)     // displays "string"

 
Refer: http://stackoverflow.com/questions/4059147/check-if-a-variable-is-a-string

Un-Select a Radio-Button by clicking on it

Problem

The situation is kind of odd however, not uncommon, atleast, I would think so. We have got a Radio Button inside each row of a GridView. As per the requirement, user should be able to select only 1 radio button at a time. This has been achieved with javascript. More details can be found here. Now selecting radio button indicates the selection for that row of the gridview. Similarly, there should be an option for dis-selecting the radio button by clicking on the selected radio button (much like the checkboxes). However, this is against the normal behaviour of the radio button, and obviously there was no simple way of doing it. So I decided to put a check on the OnClick property of the Radio Button. The check was like this

if (rdBtn.checked == true {
	rdBtn.checked = false;
}

However, because of this, I was not able to select the Radio Button in the first place. Unlike, checkbox, once checked, a radio button will always return true when it is checked and my script was simply clearing the checked state thereby, not letting me select any option.

Solution

After doing a bit of R&D I realized that instead of making things complicated, I should put a simple check, & instead of relying on the checked property of the radio button I will check the id of the current selected radio button. If the current radio button’s id matches with that of the hiddenField value, I will simply clear the check of that radio button

<script language="javascript" type="text/javascript">
	function SelectSingleRadiobutton(rdbtnid) {
		var hd = document.getElementById('hdnFld');
		var rest = false;
		var rdBtn = document.getElementById(rdbtnid);
		var rdBtnList = document.getElementsByTagName("input");
		for (i = 0; i < rdBtnList.length; i++) {
			if (rdBtnList[i].type == "radio") {
				if (rdBtnList[i].id != rdBtn.id) {
					rdBtnList[i].checked = false;
				}
				else if (hd.value == rdBtnList[i].id) {
					rdBtnList[i].checked = false;
					rest = true;
				}
			}
		}
		hd.value = (rest) ? "" : rdbtnid;
	}
</script>

Inside the GridView’s ItemTemplate I have called the above script for the OnClick event of the Radio Button

<asp:TemplateField>
	<ItemTemplate>
		<asp:RadioButton ID="rdbOptions" runat="server" OnClick="javascript:SelectSingleRadiobutton(this.id)" />
	</ItemTemplate>
	<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>

That’s it …

Make Single RadioButton Selection in Gridview using Javascript

Problem

Here, I will be adding two columns in a GridView. One will contain a RadioButton, and the other one will have some text. The user however, can select only one RadioButton at a time. Multi-select needs to be disabled. The problem is that each row contains a new RadioButton so the user was able to select all the RadioButtons.

Solution

Solution is only one thing, javascript. On click on one of the radio button, all other radiobuttons should be disabled. The javascript code is as follows:-

<script language="javascript" type="text/javascript">
	function SelectSingleRadiobutton(rdbtnid) {
		var rdBtn = document.getElementById(rdbtnid);
		var rdBtnList = document.getElementsByTagName("input");
		for (i = 0; i < rdBtnList.length; i++) {
			if (rdBtnList[i].type == "radio" && rdBtnList[i].id != rdBtn.id)
			{
				rdBtnList[i].checked = false;
			}
		}
	}
</script>

The definition of Grid is defined below. Note: the javascript call for the radio Button:-

<asp:GridView ID="gvdata" runat="server" CssClass="Gridview" AutoGenerateColumns="false" >
	<Columns>
		<asp:TemplateField>
			<ItemTemplate>
				<asp:RadioButton id="rdbUser" runat="server" OnClick="javascript:SelectSingleRadiobutton(this.id)" />
			</ItemTemplate>
		</asp:TemplateField>
		<asp:BoundField DataField="SomeData" HeaderText="Some Text"/>
	</Columns>
</asp:GridView>

 

Thanks…

 

JavaScript Hoisting : Variable Initialization

In JavaScript, Variable Initialization always takes precedence. Even, Function objects are created for all Function Declarations and got assigned to Global Objects. For ex. look at the following code: 

var x = 500;
function check() {
if (typeof(x) === 'undefined') {
  var x = 100;
  alert(x);
}
alert(x);
}
check();
alert(x);

 

The above code will give 3 alert messages with the response as 100, 100, & 500

 

 

Explanation

Actually, this is how the code is getting compiled.

/* x is already defined and assigned with value 5 and is available in 
   the Global scope. */
var x=500;
	   

function check( ) {
	
	// variable x get hoisted to the top.
	var x;
	if (typeof(x) === 'undefined') {  
		//therefore, here it will be undefined.
		
		//assigning value 100
		x = 100;
		
		//x will be 100
		alert(x);
	}
	
	// x will be 100 , value of x will be 100 inside the function scope.
	alert(x);
}

check();

/* here the value of x will be still 500. Since it has its own value available in 
   the global scope.*/
alert(x);

As you can see, x has both a Global as well as a local declaration. Now even though the local variable x is declared inside the if loop, at the time of execution, when the method check is called, first all the variables of that function (in this case only x) gets declared. So x is declared (not defined) even before the if loop, & when the condition matches, 100 is then assigned to the local variable x. However, the scope of this 100 lies within the function only and so, when an alert is raised in the last line, it will display 500 (Value of the Globally declared variable x).