Lets Play JavaScript, trips and tricks

Note: I have moved to blog at my own domain, so kindly visit this post over there for recent updates or comments. http://www.imranbalouch.com/blog/index.php/2011/03/lets-play-javascript-trips-and-tricks/

I am writing this blog for different tips and tricks for javascript on demand of a friend of mine who is new to this world, it might contain normal and newbies methods and might have complex scripts. I will be updating it on regular basis.

String Manupulation

To remove/replace some character(s) from string use String.replace() method:

<script type="text/javascript">
        var str1 = "imran balouch";
        str1 = str1.replace("imran","");
        alert (str1);
</script>
Don't forget to assign back the results or replace method to variable.

To get a substring from a string you can use either substring method or slice method.

var str = "Imran Balouch!";
var newStr = str.substring(0, str.length-1);
alert(newStr);
// alert Imran Balouch

The slice() method takes at least one integer argument, which determines after which character the substring will be extracted.

var str = new String("Imran Balouch!");
alert( str.slice(6) );
the alert will show Balouch!

If you pass negative integer to slice method,slice() will cycle backwards (from end to start) through the string until it has iterated through as many characters as the absolute value of the integer passed.

var str = new String("Imran Balouch!");
alert( str.slice(-8) );
the alert will show Balouch!

The second argument optionally accepted by the slice() method is also an integer, and determines the length of the substring returned.

var str = new String("Imran Balouch!");
alert( str.slice(6,7) );
the alert will show Balouch

Other useful methods can be:

Length is a read-only property of JavaScript strings: your scripts can retrieve a string's length (the number of characters it contains), but cannot set it to a new length value.The length property contains and returns a positive integer, or zero in the case of an empty string.
 var str = new String("Imran Balouch!");
alert( str.length.toString() );
alert will show 14.
The charAt() method, a string method that allows you to determine which character is at a given position in a string.
var str = new String("Imran Balouch!");
alert(str.charAt(str.length-1) );
the alert will show !
alert will show 14.

Javascript and C#

If you have created a javascript method and want to call from server side than following can be helpful for you:

<script type="text/javascript">
function callMeFromServer()
{
    alert("Imran Balouch!");
}
</script>

now is your server side code (following is C# code), you can get this method called by:
ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "Testing", "callMeFromServer();", true);
ScriptManager class is present under System.Web.UI

If you are in need of building a javascript array from server side, following can be helpful for you, again its C# code:

System.Random random = new System.Random();
System.Text.StringBuilder clientArray = new System.Text.StringBuilder(String.Empty);
clientArray.Append(" var myArray= new Array(3);");
clientArray.Append("myArray[0]=Imran;");
clientArray.Append("myArray[1]=Balouch;");
clientArray.Append("myArray[2]=!;");
ScriptManager.RegisterStartupScript(this, typeof(String), "BuildMyArray" + random.Next(), clientArray.ToString(), true);

Above code will create a javascript array named myArray and you can access it from client side as:

<script type="text/javascript">
function useMyArray()
{
    if(myArray!=null)
    {
         alert(myArray[0]);
         alert(myArray[1]);
     }
     else
          alert("Array is null, some problem occured.");
}
</script&gt

All for now,I will be editing this post off and on.
All is Well!!

Postback behavior of dropdown in firefox

Note: I have moved to blog at my own domain, so kindly visit this post over there for recent updates or comments. http://www.imranbalouch.com/blog/index.php/2011/03/postback-behavior-of-dropdown-in-firefox/

I am not sure that either it is behavior of firefox or not but that was a strange thing that happened to me during a development.

I have a web application in ASP.NET and C#. On a page I have a drop down list, which works fine in IE. However in firefox if I click on the dropdown, it get expanded, now if i type some charcter, relevant value get selected, now if i click out side the dropdown anywhere on my page, dropdown collpased, new value is shown as selected but no post back occurs even auto post back is set to true.

I even put a client side function to call on change of value, but that also didn’t get called.

I feel like that it is behavior of firefox, caz it appears that firefox postbacks data after dropdown looses focus. on 1st click the focus is at the dropdown and on 2nd click dropdown looses focus. But the wiered thing is that in dropdown new value is being displayed to the user.

But on the other hand if we see it is a nice behavior of firefox, caz on dropdown list if autopoastback is set to true than in IE, if u move focus to dropdown and type A, first value starting with A is selected and page is post backed where as firefox waits for lossing focus so that if selected value is not your desired one than u can reach desired value and avoid extra post backs.

A way out that I found to avoid it in case of mouse usage is to capture the onclick event of dropdown in javascript and hold a value that the dropdown is opened now and capture onclick event of page and see if previous click was on dropdown and new click is not on dropdown than using dopostback, make a post back for the dropdown. I know currently its a wiered solution but right now i figured out only this way to handle it.

All is Well…