Submit form and show result on external site in overlay or popup (java noob ;-) )

JavaScript
1

Hi everybody,

One of my clients is a car repair shop and I would like to implement a license plate check.
I can use a script that shows a small input box on my own site. When I fill in the license plate number and click on the “submit” button,
it will open a new window/tab with the official government site showing all info of the car.

I would like this site to open in an overlay on my own site, or a modal/popup window. Is this even possible?

This is the script I’m using:

<!-- Het script verbergen voor oude browsers
document.write("<form method='post' action='http://publiek.vwe.nl/index.aspx' name='vwe_kenteken_advanced' target='_blank'>");
document.write("<table style='BORDER: 1px solid #cccccc; WIDTH: 120px; HEIGHT: 60px' cellspacing='0' cellpadding='0' bgcolor='#ffffff'>");
document.write("<tr>");
document.write("<td valign='middle' align='right' width='90'>");
document.write("<table style='BORDER: 1px solid #000000;WIDTH: 82px; HEIGHT: 15px' cellspacing='0' cellpadding='0'>");
document.write("<tr>");
document.write("<td bgcolor='#3300cc'><img src='http://publiek.vwe.nl/IMG/k_left.gif' width='10'></td>");
document.write("<td style='BACKGROUND-COLOR: #ffCC00' align='center' width='1'><input name='Kenteken' type='text' style='text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-size: 11px; letter-spacing: 2px; font-weight: normal; background-color: #ffCC00; BORDER: 0px solid #ffcc00; height: 10px; margin-left: 0px; margin-top: 0px; margin-bottom: 2px;WIDTH: 72px; HEIGHT: 16px' maxlength='8' size='6' autocomplete='off' />");
document.write("</td>");
document.write("</table>");
document.write("</td>");
document.write("<td valign='top'>");
document.write("<input type='image' src='http://publiek.vwe.nl/img/button-go.gif' border='0'>");
document.write("</td>");
document.write("</tr>");
document.write("<tr>");
document.write("<td colspan='2'>");
document.write("<a href='http://www.vwe.nl' target='_blank'><img src='http://publiek.vwe.nl/img/poweredby.gif' border='0'></a>");
document.write("<td>");
document.write("</tr>");
document.write("</table>");
document.write("</form>");
// Einde verbergen -->

Really hope somebody can give me some advice how to modify the script.

Victor

2

Hi,

I think you should be able to do this using Fancybox and an iframe.

Also, is there any reason for using document.write to output the form on your page, as opposed to plain HTML?
This is considered somewhat of a bad practice.

3

Thanks Pullo,
fancybox seems to be a good idea! I’ll give it a try and will post back once it’s working.

I only implemented one line of code I received, but you’re probably right, I could just use the html part of the script.

Thanks again,
Victor

4