Solved

Hiding a button during a function

Posted on 2007-03-22
9
393 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
[X]
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
  • 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
Instantly Create Instructional Tutorials

Contextual Guidance at the moment of need helps your employees adopt to new software or processes instantly. Boost knowledge retention and employee engagement step-by-step with one easy solution.

 
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: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say 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

Title # Comments Views Activity
Hta File displays dynamic File names 4 65
Calculating percentage 2 49
Can't get video to center on page 2 46
allow link tag to be submit like form 15 60
In this post we will learn how to make Android Gesture Tutorial and give different functionality whenever a user Touch or Scroll android screen.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

752 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