Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Hiding a button during a function

Posted on 2007-03-22
9
391 Views
Last Modified: 2013-11-23
I've got some Java Script with a button...

<button id="but1" onclick="doFmt();factory.printing.Print(false)">Print</button>

<script defer>
function doFmt() {
factory.printing.Printer = "SATO CX400"
  factory.printing.SetMarginMeasure(2) // set inches
  factory.printing.header = ""
  factory.printing.footer = ""
  factory.printing.portrait = true
  factory.printing.leftMargin = .5
  factory.printing.topMargin = .01
  factory.printing.rightMargin = .01
  factory.printing.bottomMargin = .01
  factory.printing.copies = 1
  factory.printing.printBackground = true
  factory.printing.paperSize = "Index Card"
}
</script>

How do I hide the button until the function is complete, and then make it reappear?



TIA
0
Comment
Question by:Mike Miller
  • 5
  • 3
9 Comments
 
LVL 9

Expert Comment

by:smidgie82
ID: 18774290
This is a slightly more user-friendly version:

<button id="but1" onclick="doFmt();factory.printing.Print(false)">Print</button>

<script defer>
function doFmt() {
var temp = document.getElementById('but1').text;
document.getElementById('but1').disabled = 'true';
document.getElementById('but1').text = 'Please Wait';
factory.printing.Printer = "SATO CX400"
  factory.printing.SetMarginMeasure(2) // set inches
  factory.printing.header = ""
  factory.printing.footer = ""
  factory.printing.portrait = true
  factory.printing.leftMargin = .5
  factory.printing.topMargin = .01
  factory.printing.rightMargin = .01
  factory.printing.bottomMargin = .01
  factory.printing.copies = 1
  factory.printing.printBackground = true
  factory.printing.paperSize = "Index Card"
document.getElementById('but1').text = temp
document.getElementById('but1').disabled = 'false'
}
</script>

If for some reason the function fails, or throws an exception, or for whatever reason doesn't execute normally, however, the button will not be re-enabled.

I'd recommend wrapping your printer calls in a try{} block.  That way you can add some more user-friendly exception handling as well, and guarantee that regardless of whether the document prints, the button is re-enabled.  for instance:

var temp = document.getElementById('but1').text;
document.getElementById('but1').disabled = 'true';
document.getElementById('but1').text = 'Please Wait';
try
{
factory.printing.Printer = "SATO CX400"
  factory.printing.SetMarginMeasure(2) // set inches
  factory.printing.header = ""
  factory.printing.footer = ""
  factory.printing.portrait = true
  factory.printing.leftMargin = .5
  factory.printing.topMargin = .01
  factory.printing.rightMargin = .01
  factory.printing.bottomMargin = .01
  factory.printing.copies = 1
  factory.printing.printBackground = true
  factory.printing.paperSize = "Index Card"
}
catch(e)
{
alert("something unexpected happened");
}
document.getElementById('but1').text = temp
document.getElementById('but1').disabled = 'false'
0
 

Author Comment

by:Mike Miller
ID: 18774910
smidgie...

It printed ok, but the button was on what i printed. i can't tell if the disabled worked or not from what i printed, but i want it gone completely when it prints.
0
 

Author Comment

by:Mike Miller
ID: 18774919
here's what i tried


<button id="but1" onclick="doFmt();factory.printing.Print(false)">Print</button>

<script defer>

function doFmt() {
var temp = document.getElementById('but1').text;
document.getElementById('but1').disabled = 'true';
document.getElementById('but1').text = 'Please Wait';
try
{
factory.printing.Printer = "SATO CX400"
  //factory.printing.SetMarginMeasure(2) // set inches
  factory.printing.header = ""
  factory.printing.footer = ""
  factory.printing.portrait = true
  factory.printing.leftMargin = .5
  factory.printing.topMargin = .01
  //factory.printing.rightMargin = .01
  factory.printing.bottomMargin = .01
  factory.printing.copies = 1
  factory.printing.printBackground = true
  //factory.printing.paperSize = "Index Card"
}
catch(e)
{
alert("An unexpected error has occurred.");
}
document.getElementById('but1').text = temp
document.getElementById('but1').disabled = 'false'
}
</script>
0
Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 8

Expert Comment

by:bebonham
ID: 18776719
<script defer>
function doFmt() {
document.all('but1').style.visibility="hidden"
window.print();
document.all('but1').style.visibility="visible"
}
</script>

//or you can put ur factory.printing stuff back in there instead of window.print() I used for testing.
no button shows on my print.
0
 

Author Comment

by:Mike Miller
ID: 18779548
here's what i've got...

<button id="but1" onclick="doFmt();factory.printing.Print(false)">Print</button>

<script defer>
function doFmt() {
document.all('but1').style.visibility="hidden"
factory.printing.Printer = "SATO CX400"
  //factory.printing.SetMarginMeasure(2) // set inches
  factory.printing.header = ""
  factory.printing.footer = ""
  factory.printing.portrait = true
  factory.printing.leftMargin = .5
  factory.printing.topMargin = .01
  //factory.printing.rightMargin = .01
  factory.printing.bottomMargin = .01
  factory.printing.copies = 1
  factory.printing.printBackground = true
  //factory.printing.paperSize = "Index Card"
  document.all('but1').style.visibility="visible"
}
</script>


but the button is still visible when printing :-(
0
 

Author Comment

by:Mike Miller
ID: 18780142
I think I know what's going on. This is on an ASP page. When the page gets posted back, I guess the page rerenders with the print button in tact. Is there any way around this?
0
 
LVL 8

Expert Comment

by:bebonham
ID: 18780342
Actually, it is likely that it has to do with the factory objects method of printing (although I don't know for sure)

What would help is if you could post the page somewhere where we can test it.
Just out of curiosity, did it work the way I originally posted it, with the window.print instead of the factory stuff?

0
 

Author Comment

by:Mike Miller
ID: 18780370
I took out the factory stuff and just did the visibility stuff...worked fine.

I can't post it anywhere either because all that factory stuff is getting the print commands from an active x control on a server at my job. The control was purchased, and I don't have licensing for any other domains.
0
 
LVL 8

Accepted Solution

by:
bebonham earned 500 total points
ID: 18781727
okay, well, I think we are kind of at an impasse, at least as far as this way is concerned.

If it is really important to not have the button, you can have the print button open up the same page (differnt url obviously), but without the button in a new window then put your script with the factory stuff at the bottom of the page after all the html (or trigger the function from the body onload event).  In any case, you just make a copy of the page you have now, and take out the <button> and have the script that prints run on the load. That page gets open by the page u already have.
then maybe you have some code that closes the window.  Let us know if you need further assistance.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
This tutorial will introduce the viewer to VisualVM for the Java platform application. This video explains an example program and covers the Overview, Monitor, and Heap Dump tabs.

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question