windsurfer Posted November 20, 2020 Share Posted November 20, 2020 So i have an html area as shown and when i hit print the print and close buttons disappear since i don't want them printed, problem is that when the print screen is open and i cancel because i forgot to add something to the form the form comes back up but the buttons don't of course since i hid them, would there be a way to get those back. I know f5 will bring them back but will also wipe out anything in the text box. Link to comment Share on other sites More sharing options...
bsmither Posted November 20, 2020 Share Posted November 20, 2020 I am guessing that hiding the buttons is necessary because by whatever means of getting the text box to print they are part of the identified area to get printed. But if the area is identified by a specific node, tag name, or tag attribute, would it be possible to narrow the identified area to be printed to just the text box? Link to comment Share on other sites More sharing options...
windsurfer Posted November 20, 2020 Author Share Posted November 20, 2020 In the event of the button i don't see an option to just print a specific portion of the page. Link to comment Share on other sites More sharing options...
bsmither Posted November 20, 2020 Share Posted November 20, 2020 Then what does the button select to print, and how does the print action know to hide the buttons? Link to comment Share on other sites More sharing options...
windsurfer Posted November 20, 2020 Author Share Posted November 20, 2020 When the button is clicked these events take place 1) Hide 1 button 2) hide second button 3) Print This opens the print window in the same window , when i select cancel the textarea window opens back up but the buttons are gone, when i click F5 the buttons come back and the txtarea is still populated, when i click CTRL F5 the windows refreshes but the txtarea will be empty. I am not sure how i can open the print window with only the txtarea showing Link to comment Share on other sites More sharing options...
bsmither Posted November 20, 2020 Share Posted November 20, 2020 Is there any way to look at the code associated with the third item in the list? Link to comment Share on other sites More sharing options...
windsurfer Posted November 20, 2020 Author Share Posted November 20, 2020 <!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes"> <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed' rel='stylesheet' type='text/css'> <link href="https://www.wilstv.com./css/jquerysctipttop.css" rel="stylesheet" type="text/css"> <style>*{box-sizing:border-box}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline} body { background-color: #fff; font-family:'Roboto Condensed' ; } .container { margin: 10px auto; max-width: 700px; } form#e { max-width: 700px; margin-bottom: 2vh } form#e label { display: flex; justify-content: space-between; margin-bottom: 12px; color: #b3b3b3; font-size: 18px } form#e label .jQTAreaCount, form#e label .jQTAreaValue { font-weight: bold } form#e label .jQTAreaValue { color: #595959; } form#e textarea { border: 1px solid #000; width: 700px; height: 50vh; font-size: 16px; color: #666; padding: 10px; resize: none; overflow: hidden; } form#e p { height: 4px; margin-top: 2px; background-color: #ccc; } </style> </head> <body class="table"><div id="jquery-script-menu"> <div class="jquery-script-center"> <div class="jquery-script-ads"><script type="text/javascript"><!-- </script> </div> <div class="jquery-script-clear"></div> </div> </div> <div class="container"> <h1></h1> <form id="e"> <label for="example"> <span> Type your information below. (Limit 1000 Chracters) </span> <span> <em class="jQTAreaCount"></em> / <em class="jQTAreaValue"></em> </span> </label> <textarea id="example" name="example"></textarea> <p class="jQTAreaExt" width= "560px"></p> </form> </div> <div align="center"> <table border="1" width="560"> <tr> <td> <button type="submit" id="ThemeableButton1" onclick="ShowObject('ThemeableButton1', 0);ShowObject('ThemeableButton2', 0);window.print();return false;" name="" value="Print" style="position:absolute;width:126px;height:22px;">Print</button> </td> <td> <button type="submit" id="ThemeableButton2" onclick="history.back();return false;" name="" value="Close" style="position:absolute;width:126px;height:22px;">Close</button> </td> </tr> </table> </div> <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"></script> <script src="https://wilstv.com/plugin/plugin-jqtarea.js"></script> <script> $("form#e").find("textarea").jQTArea({ setLimit: 1000, setExt: "W", setExtR: true }); </script> </body> </html> Link to comment Share on other sites More sharing options...
NiteFox Posted November 20, 2020 Share Posted November 20, 2020 Can't you just use something like: add the following to your page styling @media print{ .no-print{ display:none; } } then just add the class "no-print" to the buttons you don't want to print.. That way the buttons are always there but just not when printing. Link to comment Share on other sites More sharing options...
bsmither Posted November 20, 2020 Share Posted November 20, 2020 Ah! I like that! Link to comment Share on other sites More sharing options...
bsmither Posted November 20, 2020 Share Posted November 20, 2020 Depending on the sophistication of your Themeable Button Events tab, after the javascript event, there may be the ability to add an event where the 'Event' is "onafterprint" and the action is "Unhide" or "Show" the buttons. Link to comment Share on other sites More sharing options...
NiteFox Posted November 20, 2020 Share Posted November 20, 2020 16 minutes ago, bsmither said: Depending on the sophistication of your Themeable Button Events tab, after the javascript event, there may be the ability to add an event where the 'Event' is "onafterprint" and the action is "Unhide" or "Show" the buttons. From what I recall the onafterprint has limited cross browser support so if its customer facing could be buggy for some. Link to comment Share on other sites More sharing options...
windsurfer Posted November 20, 2020 Author Share Posted November 20, 2020 That works thank you Before And after Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.