preview form using javascript in popup

Posted by user1015309 on Pro Webmasters See other posts from Pro Webmasters or by user1015309
Published on 2012-09-08T14:50:51Z Indexed on 2012/09/08 15:50 UTC
Read the original article Hit count: 229

Filed under:
|

please I need some help in previewing a form in popup. I have a form, quite big, so I added the option of preview to show as popup. The lightbox form popup works well, but the problem I now have is function passform ()passing the inputs(textfield, select, checkbox, radio) into the popup page for preview on Click(). Below are my javascript and html codes. I left the css and some html out, because I think they're not needed. I will appreciate your help. Thank you

The Javascript

function gradient(id, level)
 {
var box = document.getElementById(id);
box.style.opacity = level;
box.style.MozOpacity = level;
box.style.KhtmlOpacity = level;
box.style.filter = "alpha(opacity=" + level * 100 + ")";
box.style.display="block";
return;
}


function fadein(id) 
 {
var level = 0;
while(level <= 1)
{
    setTimeout( "gradient('" + id + "'," + level + ")", (level* 1000) + 10);
    level += 0.01;
}
   }


     // Open the lightbox


  function openbox(formtitle, fadin)
   {
    var box = document.getElementById('box'); 
    document.getElementById('shadowing').style.display='block';

    var btitle = document.getElementById('boxtitle');
    btitle.innerHTML = formtitle;

    if(fadin)
     {
 gradient("box", 0);
 fadein("box");
     }
    else
     {  
     box.style.display='block';
     }      
     }


      // Close the lightbox

     function closebox()
     {
      document.getElementById('box').style.display='none';
      document.getElementById('shadowing').style.display='none';
     }

     //pass form fields into variables
     var divexugsotherugsexams1 = document.getElementById('divexugsotherugsexams1');
     var exugsotherugsexams1 = document.form4.exugsotherugsexams1.value;

     function passform()
     {
      divexugsotherugsexams1.innerHTML = document.form4.exugsotherugsexams1.value;
     }

The HTML(with just one text field try):

      <p><input name="submit4" type="submit" class="button2" id="submit4" value="Preview Note" onClick="openbox('Preview Note', 1)"/>
  </p>
  <div id="shadowing"></div>

   <div id="box">
  <span id="boxtitle"></span>
  <div id="divexugsotherugsexams1"></div>

  <script>document.write('<PARAM name="SRC" VALUE="'+exugsotherugsexams1+'">')</script> 
      <a href="#" onClick="closebox()">Close</a>

   </div>

© Pro Webmasters or respective owner

Related posts about JavaScript

Related posts about forms