javascript or .js files not loading properly for static html file in chrome, firefox works fine in IE

Kind of feeling itchy since couple of weeks for not being able to find out why javascript or .js files not loading properly for static html file in chrome and firefox, but works absolutely fine in IE.

Ok now used browser debugging tools, IE show the .js files loaded successfully and works fine. But chrome/forefix shows script were loaded like gibberish (chineese,japanese something like that). Something fishy going on, but how would you find it. Ok tried some other static html files and works absolutely fine, but only the html generated using xsl is having the issue.

No luck, then suddenly felt something wrong with file. Ok opened the working file in notepad and have found this file is saved ASCII encoding. Now the buggy file its in unicode that's it.

IE loads all references in the format available by the file, but chrome/firefox tries to load based on the base file (.html file) which has

m eta http-equiv="Content-Type" content="text/html; charset=utf-16"

So modified xsl to output standard utf-8 format and job done.

Never trust anything that can think for itself if you can't see where it keeps its brain.
~J.K. Rowling

Continue Reading

JQuery dialog inside update panel generating duplicate elements

JQuery dialog is a nice feature provided by JQuery UI, having said care should be taken when using dialog boxes inside an update panel.

Consider a dialog box is inside an update panel as shown below :-

      
Blogger Name
      
  
      
Blogger email
      


  

Now javascript for displaying the dialog

var btnAddBloggerData= $("#btnAddBloggerData");
btnAddBloggerData
  .unbind("click")
  .bind("click", function () {
  this.disabled = true;
  $("#bloggerdata_dialogform").dialog("destroy");
  $("#bloggerdata_dialogform").dialog({
            autoOpen: true,
            modal: true,
            width: 500,
            buttons: {
                Cancel: function () {
                    $(this).dialog("close");
                },
                "Create": function (evt) {
                /*ajax call to update */
               }
            },
            close: function () {

            }
        });

});

All seems right and works fine. If this has been an asp.net server control (.ascx) would have completely weird behaviour. Each time a post back occurs a new dialog is added and finally there would be duplication of ids ie.. number of elements with id as "bloggerdata_dialogform" will increase for every postback.

Hence to resolve this issue do not use $("#bloggerdata_dialogform").dialog("destroy"); which is a killer. Now modify your script to

$.ready(function(){
   $("#bloggerdata_dialogform").dialog({
            autoOpen: false,
            modal: true,
            width: 500,
            buttons: {
                Cancel: function () {
                    $(this).dialog("close");
                },
                "Create": function (evt) {
                /*ajax call to update */
               }
            }
        });
});
var btnAddBloggerData= $("#btnAddBloggerData");
btnAddBloggerData
  .unbind("click")
  .bind("click", function () {
  this.disabled = true;
  $("#bloggerdata_dialogform").dialog("open");

});

So instead of destroying the element and use the same element for every postback.

Errors using inadequate data are much less than those using no data at all.
Charles Babbage

Continue Reading

Visual studio 2010 run post build events based on debug or release mode

Using a batch file that should be run after post build is a common task. But some actions are not required in debug mode and some times in release mode.

To achieve this create 2 batch files
1. debugpostbuild.bat
2. releasepostbuild.bat

Update post-build event command line as follows:-
1. goto VS2010 -> right click on your project -> properties -> Build Events
2. copy below code

if $(ConfigurationName) == Release (
call $(SolutionDir)\debugpostbuild.bat
)
else (
call $(SolutionDir)\releasepostbuild.bat
)

That's it. so simple.

Any sufficiently advanced technology is indistinguishable from magic. ~Arthur C. Clarke

Continue Reading

Structure of jqGrid after generating html and its contents

Something which might be useful for everyone using jqgrid.

JQGrid HTML structure:

for short form refer to the following link stackoverflow.com.


Errors using inadequate data are much less than those using no data at all.
Charles Babbage

Continue Reading