datetime - javascript printer friendly form with date problem -
beneath see piece of custom code zendesk. works fine, till want implement date/time snippet.
normally script works this:
1 - there button says "print ticket".
2 - button has onclick event open printer friendly page ready printing. after implementing date/time code (what didn't believe) blanc page date , time.
the thing happends date , time shown without rest of printable form.
i think have call date/time javascript in other way, don't know how.
can please me this?
<style> input.createtable { display:none; } </style> <script language="javascript"> <!-- writeconsole = function(content) { top.consoleref=window.open('','myconsole', 'width=800,height=800' +',menubar=0' +',toolbar=0' +',status=0' +',scrollbars=1' +',resizable=1') // top.consoleref.document.open("text/html","replace"); top.consoleref.document.writeln( '<html><head><title>signature page</title></head>' +'<style>th {color: #ffffff;border-bottom: 1px solid #000000;background-color:#cccccc;}tr {color: #000000;border-bottom: 1px solid #cccccc;}td.small {color: #000000; font-size: 12px; font-family: verdana, arial, helvetica, sans-serif;}td.large {color: #000000; font-size: 120%; font-family: arial, helvetica, sans-serif;font-weight: bold; text-align:center;}</style>' +'<link href="http://asset3.zendesk.com/stylesheets_old/zd_print.css?1270161524" media="print" rel="stylesheet" type="text/css" />' +'<body onload="self.focus()" style="background: white; font-size: 11px; font-family: verdana, arial, helvetica, sans-serif">' +'<center><a href="javascript:window.print()">print werkorder</a></center>' +'<table width="100%"><tr><td align="left" valign="middle">' +'</td><br />' +'www.domain.nl<br />' +'tel: 058-111111111<br />' +'e-mail info@domain.nl' +'</tr></table>' +content +'</body></html>' ) top.consoleref.document.close() } //--> </script> <script language="javascript"> // today's current date. var = new date(); // array list of days. var days = new array('sunday','monday','tuesday','wednesday','thursday','friday','saturday'); // array list of months. var months = new array('january','february','march','april','may','june','july','august','september','october','november','december'); // calculate number of current day in week. var date = ((now.getdate()<10) ? "0" : "")+ now.getdate(); // calculate 4 digit year. function fourdigits(number) { return (number < 1000) ? number + 1900 : number; } // join today = days[now.getday()] + ", " + months[now.getmonth()] + " " + date + ", " + (fourdigits(now.getyear())) ; // print out data. document.write(today); // end --> </script> <form> <input class="createtable" name=userinput type=textarea size="1" value="<table width=100% height=825 border=0 cellpadding=6 cellspacing=4> <tr> <th colspan=6><h1>werkorder nr#: {{ticket.id}}</h1></th> </tr> <tr> <td colspan=6><hr width=100% noshade=noshade /></td> </tr> <tr> <td width=13% valign=top><strong>klantinformatie:</strong></td> <td width=87% align=left valign=top><p><strong>datum: <script language="javascript"> // today's current date. var = new date(); // array list of days. var days = new array('sunday','monday','tuesday','wednesday','thursday','friday','saturday'); // array list of months. var months = new array('january','february','march','april','may','june','july','august','september','october','november','december'); // calculate number of current day in week. var date = ((now.getdate()<10) ? "0" : "")+ now.getdate(); // calculate 4 digit year. function fourdigits(number) { return (number < 1000) ? number + 1900 : number; } // join today = days[now.getday()] + ", " + months[now.getmonth()] + " " + date + ", " + (fourdigits(now.getyear())) ; // print out data. document.write(today); // end --> </script> <br /> naam</strong>: {{ticket.requester.name}}<br /> <strong>bedrijf:</strong> {{ticket.organization.name}}<br /> <strong>telefoonnummer:</strong> {{ticket.ticket_field_484140}}<br /> <strong>e-mail:</strong> {{ticket.requester.email}}</p></td> </tr> <tr> <td valign=top><strong>in ontvangst genomen:</strong></td> <td align=left valign=top><strong>merk & model:</strong> {{ticket.ticket_field_483591}}<br /> <strong>hardware type:</strong> {{ticket.ticket_field_484179}}<br /> <strong>uitbesteed:</strong> {{ticket.ticket_field_483608}}<br /> <strong>prioriteit:</strong> {{ticket.priority}}</td> </tr> <tr> <td colspan=6><hr width=100% noshade=noshade /></td> </tr> <tr> <td valign=top><strong>overeengekomen:</strong></td> <td colspan=5 rowspan=2 valign=top><p> </p></td> </tr> <tr> <td> </td> </tr> <tr> <td colspan=6><hr width=100% noshade=noshade /></td> </tr> <tr> <td valign=top><strong>handtekening voor akkoord:</strong></td> <td colspan=5><table width=100% border=0 cellspacing=7 cellpadding=7> <tr> <td width=33%> </td> <td width=33%> </td> <td width=31%> </td> </tr> <tr> <td width=33%><hr noshade=noshade /></td> <td width=33%><hr /></td> <td><hr /></td> </tr> <tr> <td width=33%> {{ticket.requester.name}} </td> <td width=33%>datum:</td> <td>plaats:</td> </tr> </table> <p><br /> </p></td> </tr> </table>"> <input type=button value="print werkorder" onclick="writeconsole(this.form.userinput.value)" > </form> edit question
this have now, form appears again, without date, why this?
i'll post in short code again:
the altered javascript:
<script language="javascript"> // today's current date. var = new date(); // array list of days. var days = new array('sunday','monday','tuesday','wednesday','thursday','friday','saturday'); // array list of months. var months = new array('january','february','march','april','may','june','july','august','september','october','november','december'); // calculate number of current day in week. var date = ((now.getdate()<10) ? "0" : "")+ now.getdate(); // calculate 4 digit year. function fourdigits(number) { return (number < 1000) ? number + 1900 : number; } // join today = days[now.getday()] + ", " + months[now.getmonth()] + " " + date + ", " + (fourdigits(now.getyear())) ; // print out data. // document.write(today); // begin altered code document.getelementbyid("date").innerhtml = today; // end altered code // end --> </script> in form call date this:
<tr> <td width=13% valign=top><strong>klantinformatie:</strong></td> // part has being altered <td width=87% align=left valign=top><p><strong>datum: <div id=date></div> // end altered part <br /> naam</strong>: {{ticket.requester.name}}<br /> <strong>bedrijf:</strong> {{ticket.organization.name}}<br /> <strong>telefoonnummer:</strong> {{ticket.ticket_field_484140}}<br /> <strong>e-mail:</strong> {{ticket.requester.email}}</p></td> </tr>
by using document.write getting rid of else in document. instead put div on page id , fill using innerhtml.
document.getelementbyid("date").innerhtml = today;
editing answer due question edit
by putting js in head tag running before dom ready , causes error when trying div id since not there. there 2 ways around this.
- take @ jquery method of .ready(), http://api.jquery.com/ready/.
- move document.getelementbyid call seperate script tag @ bottom of body. cause browser layout page, having full dom, , run code fill in date.
Comments
Post a Comment