Hi everyone.
I had a question regarding a preview feature I would like to implement on our intranet site.
I want to provide a preview of employee name tags that can be ordered online and I would like to do so using form fields for entering employee name and title and then have them click a button to preview their name tag.
I want to be able to take the values from the text inputs and display them in the appropriate table cells on the preview.
The preview is a DHTML table which has visibility set to 'hidden' and is then set 'visible' after the preview button is clicked.
CSS:
Javascript:
Preview button:
Any ideas of how this can be done? Thanks.
Tony
I had a question regarding a preview feature I would like to implement on our intranet site.
I want to provide a preview of employee name tags that can be ordered online and I would like to do so using form fields for entering employee name and title and then have them click a button to preview their name tag.
I want to be able to take the values from the text inputs and display them in the appropriate table cells on the preview.
The preview is a DHTML table which has visibility set to 'hidden' and is then set 'visible' after the preview button is clicked.
CSS:
Code:
<style>
.panel {
position: absolute;
top: 140;
left: 225;
width: 355;
z-index: 1;
height: 210;
visibility: hidden;
overflow: auto;
border: 1px solid #000000;
background-color: #FFFFFF;
}
</style>
Javascript:
Code:
function showPreview(previewNum) {
document.getElementById('preview'+previewNum).style.visibility = 'visible';
document.getElementById('emplTitle').style.visibility = 'hidden';
}
function hidePreview(previewNum) {
document.getElementById('preview'+previewNum).style.visibility = 'hidden';
document.getElementById('emplTitle').style.visibility = 'visible';
}
Preview button:
Code:
<input type="button" value="Preview" onClick="showPreview(1);">
Any ideas of how this can be done? Thanks.
Tony