09 April 2009

0 JavaScript code to disable the corresponding menu bar link and make it bold on loading the page

Here is the JavaScript code to disable the corresponding menu bar link and make it bold on loading the page

Consider an application with three pages. There is a link for each page in the common menu bar. On loading the page the corresponding page’s menu bar should be disabled and bold.

In the common menu bar give an id for each link. Let the id be menu1, menu2 and menu3 for the corresponding links.

For e.g. In the common JSP

<div>

      <span id ="menu1">

<html:link action="/ShowMenu1.do"> Menu1 </html:link> </span>

</div>

<div>

      <span id ="menu2">

<html:link action="/ ShowMenu2.do"> Menu2 </html:link> </span>

</div>

<div>

      <span id ="menu3">

<html:link action="/ ShowMenu3.do"> Menu3 </html:link> </span>

</div>


Use the below script in the first page JSP


<script type="text/javascript">

      document.getElementById('menu1').innerHTML =

'<a> <b> Menu1 </b> </a>';   

</script>



On loading the first page the link Menu1 becomes disabled and bold.

Read More...

0 JavaScript code to refresh the parent window on clicking of a button in a popup opened from the parent window

Here is the JavaScript code to refresh the parent window on clicking of a button in a popup opened from the parent window. The same popup could be created by different parent windows. On clicking of the button in the popup the corresponding parent window should be refreshed.

The refresh function should be in the corresponding parent windows JavaScript. Instead of var i = “/ShowInbox.do”; give the path of the corresponding parent window.  Return 0 if the parent window need not be refreshed.

// for parent page refresh after clicking ok in a popup

// this function should be in the corresponding parent windows script

 

function refresh(){

      var i="/ShowInbox.do";

      return i;

}


        Call the confirm function on clicking of the button in the popup. This in turn calls the corresponding parent windows refresh function. The refresh function returns the path of the parent window. If return is 0 the parent window is not refreshed and the popup window is closed. If a path is returned the parent window is refreshed with the corresponding path and popup window is closed.

//for reload of the opener of the confirmation

// this function should be in the pop-up’s JavaScript

 

function confirm() {

      var contextPath=document.getElementById("context").value;

      var i=window.opener.refresh();

      if (i==0){

            window.close();

      }

      else{

            window.opener.document.forms[0].action=contextPath+i;

            window.opener.document.forms[0].submit();

            window.close();

      }

}



Read More...

0 JavaScript code to trim leading and trailing spaces from a string

This JavaScript code can be used for removing unnecessary spaces from a string. That is, we can use this JavaScript snippet to trim leading and trailing spaces from a string

//To trim leading or trailing spaces

function trimString (str) {

   return str.replace(/^\s+/g, '').replace(/\s+$/g, '');  

}

The thing to note here is that the first .replace actually removes the leading blank spaces where as the second replace removes the trailing blank space. The first parameter in the .replace is known as regular expression.

 

  • ^ indicates the beginning of the string. Using a ^ metacharacter requires that the match start at the beginning.
  • $ indicates the end of the string. Using a $ metacharacter requires that the match end at the end of the string.
  • \s represents the any single space character.
  • /g represents the global search for all occurrence of the pattern 

Read More...

0 JavaScript code to get the final count of the selected items across pages in pagination and validate in JavaScript before form submission

When you are dealing with the pagination, here you go for the JavaScript code to get the final count of the selected items across pages in pagination and validate in JavaScript before form submission


var finalCount=session.length; //count of items already in session

                             

for(var i = 0; i < pageList.length; i++){

var currentPageItem = pageList[i];

//checked length is 0 and session length is 0

if (checked.length==0 && session.length > 0){

      // No items checked; previously checked items are removed

            for (var l=0; l <session.length; l++){

                  if(session[l] == currentPageItem){

                        finalCount --;

                  }

            } // end for

      }

//checked length greater than 0 and session length is 0

else if(checked.length > 0 && session.length == 0){

            // No items in session

            for(var k = 0; k < checked.length; k++){    

                  if(currentPageItem == checked[k]) {

                        // checked items in current page   

                        finalCount ++;

                  }    

            } // end for     

      }

     //checked length greater than 0 and session length greater than 0

else {          

            if(isPresent(currentPageItem, checked)){ 

                  // Item is checked     

                  if(!isPresent(currentPageItem, session)){

                        // Item is not in session; add item

                        finalCount ++;                           

                  }    

            }

else {     

                  //Item is not checked  

                  if(isPresent(currentPageItem, session)){ 

                        // Item in session; remove item    

                        finalCount --;   

                  }

            }

      } // end main if 

} // end for loop

 

alert (finalCount);


Before using the script get the three arrays used in the script.

Arrays used in the JavaScript

session - array of selected items already in session (items checked in the previous pages). This can be passed as a string separated by a comma to the script and then put into the array.

checked - array of checked items in the current page.

pageList - array of all items in the current page both checked and unchecked.

The finalCount gives the total count of selected items across pages.

The function isPresent is called to check if an item is present in the array. The function will return true if the item is present in the array else it will return false.

//function isPresent(key, Array)

//returns true if key is present in the Array

 

function isPresent(item, itemList){

      var flag = new Boolean();

      flag = false;

      for(var i = 0; i < itemList.length; i++){

            if(itemList[i]== item){

                  flag = true;

            }

      }

      return flag;

}



Read More...

08 April 2009

0 To check the select-all checkbox in a page when all other checkboxes in the page is checked

Here is the code snippet to check the select-all checkbox in a page when all other checkboxes is the page is checked or to uncheck the select all checkbox in a page when any of the other checkboxes is unchecked.

On click of any of the checkboxes other than the select-all checkbox call the function checkFunction. This function checks if all the other checkboxes with name checkItem is checked or not. If all the checkboxes with name checkItem is checked the select-all is checked. If any of the checkboxes with name checkItem is unchecked then the select-all checkbox will be unchecked.


// call this function when the any of the checkbox other than the selectall checkbox is clicked

function checkFunction(){  

      var count =0;

      var check = document.getElementsByName("checkAll");    

      var innerCheck = document.getElementsByName("checkItem");

      for (var i=0; i<innerCheck.length; i++) {         

            if(innerCheck[i].checked ==true){              

                  count = count +1;

            }          

      }

      if (count == innerCheck.length){         

            for (var i=0; i<check.length; i++) {

                  check[i].checked = true;

            }

      }

      for (var i=0; i<check.length; i++) {

            if(check[i].checked == true){            

                  for (var j=0; j<innerCheck.length; j++) {   

                        if(innerCheck[j].checked ==false){       

                              check[i].checked = false;

                        }          

                  }

            }

      }

}

- checkAll is the name of the select all checkbox

- checkItem is the name of the other checkboxes

Read More...