I have inherited some broken code but I'm not sure where the problem is. The code is a hyperlink (.control_button) which opens a form(#convert-form) in a lightbox . This then has a button (#print-button) which redirects to a php file (convert-tpl.php), passing fields from the form.
Using XDebug I can see that the variable 'testVariable' is in the $_GET array when it is passed to convert-tpl.php, but it is always set to 10, even when I change it to something else. My guess is that this is because the jQuery code is building the URL with the parameters when the page loads, so it doesn't pick up any entries in the form?
<div class="control_button"><a href="#convert-form" class="convert-link">Terms & Conditions Print</a></div>
<div id="convert-form" style="display:none;">
<h2>Print Terms & Conditions</h2>
<p>Fill out the form below to populate additional information in the terms and condition form. Then hit print to print a copy of the terms and conditions</p>
<form action="phpscripts/convert.tpl" method="get" target="_blank">
<input type="hidden" name="instructor_id" value="<?php echo $_SESSION['USER_ID']; ?>" />
<input type="hidden" name="student_id" value="<?php echo $_GET['id']; ?>" />
<div class="price-details left">
<fieldset>
<legend>Price Details</legend>
<div class="input-box">
<label for="prices_hour">1 Hour:</label><br />
<input type="text" name="testVariable" value="10"/>
</div>
</fieldset>
</div>
<div class="button-container">
<a id="print-button" href="phpscripts/convert-tpl.php" class="big-button button-link">Print</a>
</div>
</form>
</div>
<script type="text/javascript">
$(document).ready(function() {
$(".convert-link").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
jQuery('#print-button').printPage({
url: jQuery('#print-button').attr('href')+'?'+jQuery('#convert-form form').serialize()
});
});
</script>
Just putting @Sean code in action:
$(document).ready(function () {
$(".convert-link").fancybox({
maxWidth: 800,
maxHeight: 600,
fitToView: false,
width: '70%',
height: '70%',
autoSize: false,
closeClick: false,
openEffect: 'none',
closeEffect: 'none'
});
// use on function
$('#print-button').on("click", function (e) {
$(this).printPage({
url: jQuery('#print-button').attr('href') + '?' + jQuery('#convert-form form').serialize()
});
});