Archive

Posts Tagged ‘Javascript’

window.location not working in IE 6

October 21, 2010 Leave a comment

For some unknown reason, IE 6 Java-script engine doesn’t allow me to a new URL by simply changing the window.location or window.location.href properties.

The very same thing is working fine in IE 7/8, Chrome and Fire-fox. But IE 6 is doing nothing on a call like window.location.href = url; No error is returned and location of page remains the same.

On searching for this issue, i came to following solution.

This problem is resolved by replacing the direct java-script to a custom function call like:

function SetWindowLocation(url)
{
    setTimeout(function()
     {
         window.location = url;
     }, 0);
}

Calling this function will change the location in all browsers including the funny IE 6.

Categories: Javascript Tags: ,

Cappuccino – Open Source Javascript Framework

While searching for online tools for web site prototype and mock-ups, we came across a very good and free online tool “mockingbird”.

“mockingbird is an online tool that makes it easy for you to create, link together, preview, and share mockups of your website or application.” – http://gomockingbird.com

Mocking bird is built using HTML and Java-script, you can give it a try to observe the rich interactivity. mockingbird is developed using open source framework “Cappuccino”.

“Cappuccino is an open source framework that makes it easy to build desktop-caliber applications that run in a web browser.” http://cappuccino.org/

You can further learn about Cappuccino at http://cappuccino.org/learn/

Categories: Javascript Tags: ,

A Generic way to Get IDs of server controls in java-script

April 25, 2009 Leave a comment


While working with ASP.Net and java-script, we need to manipulate the HTML objects on the form. If these objects are coded as server side controls, the ids on the client side are different to what we have on the server side.

E.g. a server side text box added in a page with ID=textTitle will have its client id=ctl00_ContentPlaceHolder1_textTitle. (ctl00 is sequence identifier, ContentPlaceHolder1 is id of the parent container and txtTitle is the actual object id) The value of the client id depends on the location of the control, if we add the same control in a different position or we move it inside a user control, its client id will be different.

So one option is to hard-code its client id to access the object in java-script. But this option does not seem appropriate, as the client id can be different with time, with either addition of the new controls or with moving the object to a user control or a similar reason.

Following approach solves this problem to some extent; this approach automates the process of mapping the server and client ids of all objects on a page.

  1. Include the jsClientHtmlObjects.js into the page.
  2. Add the code mentioned in the BasePage.cs to your page class (or its base class)
  3. Include the following script to the end of the page.aspx file just before the </body> tag:

    <
    script type=”text/javascript” language=”javascript”>
             <%=ClientObjectsList%>
    </script>
  4. In Javascript, where you want to access the client instance of the server side object, call the mthods:
    • objClientHtmlObjects.GetObject(serverID) //To get the HTML object with the passed server id
    • objClientHtmlObjects.GetValue(serverID) //To get the HTML object’s value with the passed server id
Categories: C# Tags:

Add CSS to a page dynamically

February 26, 2009 Leave a comment

 Sometime, we need to add some CSS to a page dynamically.

We can use the following javascript to  add a CSS to a page. This is helful when we are adding/modifying a page in some portal applications like Joomla or Share-point. where we cannot add the CSS to a page in design time.

 

function AddCSS(skinPath)
{
        if(document.createStyleSheet)
       {
            document.createStyleSheet(skinPath);
       }
       else
       
{
              var styles = “@import url(‘ “+skinPath+” ‘);”;
              var newSS=document.createElement(‘link’);
              newSS.rel=‘stylesheet’;
              newSS.href=‘data:text/css,’+escape(styles);
              document.getElementsByTagName(“head”)[0].appendChild(newSS);
       }
}

Categories: CSS Tags: ,

Javascript: Close Main Window

February 9, 2009 Leave a comment

When we call window.close(), it closes the popup windows, that are opened up using the window.open(…) method, without any issue. But when we try to call the method window.open on a main window, that was not opened up using the window.open(…) method, window is not closed  by default and a confirm box is shown first.

In the method window.close(…) javascript simply checks if the window.opener is Null or not, if it is Null a confirm box is shown. So the trick is to set some value in the window.opener variable, this way javascript will treat this window as a popup window and the window.close will work without any message. You can try the following code yourself to experience this:

 /*This function closes the passed (or the current) window without showing the confirm box even if the window is not opened using the window.open method */

function
closeMainWindow(win)
{
          if (!win) //If no windows is passed – close the current window
          {
                    win = window;
          }

          win.opener=‘X’;
          //This will not show the confirm dialog before closing the window.
          //Javascript will treat this window as a Popup.  

          win.open(”, ‘_parent’, ); 
          //Only for IE-7, this line is not needed for IE6
          win.close(); 
          //Now the call to window.close() will not display any warning/confirm dialog on IE6 and IE7
}