Connecting Tech Pros Worldwide Help | Site Map

Disable/Enable button using onClick

Newbie
 
Join Date: Sep 2009
Location: Bangalore
Posts: 2
#1: Sep 9 '09
HI All,

I am new to javascript. I have snippet wherein i am giving a brief note on what i am trying to do. In the below have a variable by name stuff. trying to reset the page. Part of the code which does reset is attached below.

there is a reset button which will reset the connection and it takes two min for data loading during which the reset button has to be disabled and later after two mins it should enable the button for the user.

Expand|Select|Wrap|Line Numbers
  1. stuff  = "<form name=" + tagName + " action=common/setitem.php method=POST target=_self>";
  2.             stuff += "<input type=hidden name=PSET value=LEAF>";
  3.             stuff += "<input type=hidden name=" + tagID + " value=" + Reset + " >";
  4.     if (model == romit)
  5.      {
  6.        stuff += "<input type=submit id=submit_id value=\"Reset\" onclick=\"return do_reset();\">";
  7.         setTimeout("document.getElementById('submit_id').disabled=false", 120000);
  8.       }
  9.      stuff += "</form>";
  10. writeSingleTableRow(stuff, "");
  11.           }
  12.         }
  13.         writeBodyTail();
  14. function do_reset()
  15. {
  16.     var update;
  17.     update = confirm(' takes 2 mins please wait...');
  18.     if(update)
  19.     {
  20.         document.getElementById('submit_id').disabled = 'true';
  21.          return true;
  22.      }
  23.      else
  24.           return false;
  25. }
part of the code have pasted here. whats happenenig is...

disable and enable part is not added to the stuff. Is thr any way of adding it to stuff. In this case its just disabling and enabling the reset button fine but actual reset is not happening.


instead of the above if just by doing this

Expand|Select|Wrap|Line Numbers
  1. function do_reset()
  2. {
  3.     var update;
  4.     update = confirm(' takes 2 mins please wait...');
  5.     if(update)
  6.     {
  7.          return true;
  8.       }
  9.  else
  10.      return false;
  11. }
is working just fine as the true value is added to stuff and reset happens.

Also,
tried to change with this

Expand|Select|Wrap|Line Numbers
  1. stuff += "<input type=submit id=submit_id value=\"Reset Integrated Lights-Out 2\" onclick=\"this.disabled='true';return true;\">";
or

Expand|Select|Wrap|Line Numbers
  1. stuff += "<input type=submit id=submit_id value=\"Reset Integrated Lights-Out 2\" onclick=\"document.getElementById('submit_id').disabled='true';return true;\">";
here it disables but the true value is not appended to variable stuff because of which reset is not happening.

Please suggest what needs to be done.
acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,581
#2: Sep 9 '09

re: Disable/Enable button using onClick


true and false are booleans and should not be strings.
Frinavale's Avatar
Site Moderator
 
Join Date: Oct 2006
Location: The Great White North
Posts: 5,066
#3: Sep 9 '09

re: Disable/Enable button using onClick


It should be:
Expand|Select|Wrap|Line Numbers
  1. stuff += "<input type=submit id=submit_id value=\"Reset Integrated Lights-Out 2\" onclick=\"this.disabled=true;return true;\">";
I have a feeling that you're running into problems when you disable the button before the submit happens....in which case the page wont submit. If this is the case, try using the timeOut() method.
Newbie
 
Join Date: Sep 2009
Location: Bangalore
Posts: 2
#4: Sep 16 '09

re: Disable/Enable button using onClick


yes you are right i am facing a problem when i disble the button then try submitting the return value, the reset doesnt happens. I am also using the timeout function. However its not much useful.

My requirement is to disable the button for two mins, meanswhile the reset should happen. please sugest the way i can do this.
Frinavale's Avatar
Site Moderator
 
Join Date: Oct 2006
Location: The Great White North
Posts: 5,066
#5: Sep 16 '09

re: Disable/Enable button using onClick


Consider leaving the buttons enabled but displaying a <div> over top of the content while the update is happening. Make the <div> transparent.

This will block them from using the controls either for the whole page or just the section over the buttons....
Reply