Question

I would like to incorporate a help button into my application. The way i see this help button working would be something similar to what is found in windows applications, e.g. The user would click the help button and then click on the component they would like help with.

I was thinking of setting a global listener once the help button is clicked, so that the next onClick fired would be that of the component the user wants help with. I have not yet looked into doing this yet so any suggestions would be great!

Also i would like to hear your oppinnion in which way to approach this problem.

Thanks in advance!

Answer 1

i am giving answer assuming jQuery included, well you can go for pure javascript too.

declare a global variable – lets say var helpRequested = false;
assuming that there are few elements on your web page with help provided, lets say you apply css class <div class="help someothercssclass"> ... </div> to all these element,
now subscribe to click event of all these help needed elements

$('.help').click(function(event) {
  event.preventDefault();
  if(helpRequested === true) {
    var id = $(this).attr('id');
    //based on id do your stuff... like provide help through popup window

    helpRequested = false; //finally reset
  }    
});

now subscribe to click event of help button <button id="helpbutton">Help</button>
like this

$('#helpbutton').click(function() { 
     helpRequested = !helpRequested ; //toggle the value
});

i guess this will do the work… or something to start