Alex Alex - 4 months ago 7
Javascript Question

jQuery form returns blank page when submitted

I have created forms before and they usually work, but I am new with jquery and I am wondering if there is something different here. When I submit the form by hitting the "Submit" button, it directs me to "strategyreview.php", but the page is blank. I know the page is not normally blank because I can load it directly just fine.

Please help.

Form: strategy.php

<!-- CSS -->
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">

<!-- JS -->
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

<script>jQuery.noConflict();</script>

<!-- Fonts -->
<link href='https://fonts.googleapis.com/css?family=Glegoo:400,700' rel='stylesheet' type='text/css'><!--Glegoo -->
<link href='https://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'><!--Abel -->

<style>
#title {
font-size: 4vh;
}
</style>


<form action="strategyreview.php" method="post">
<div class="ui-corner-all custom-corners">
<div class="ui-bar ui-bar-a" id="title">
<h3 class="title">Strategy Testing</h3>
</div>
<div class="ui-body ui-body-a">

<!--Strategy Title -->
<h3 class="ui-bar ui-bar-a ui-corner-all">New Strategy</h3>
<div class="ui-body ui-body-a ui-corner-all">
<div class="ui-field-contain">
<label>Strategy Name</label>
<input name="strategyname" type="text" class="form-control" placeholder="Monthly Low Risk" required>
</div>
</div>

<!--Initial Spread Criteria:-->
<h3 class="ui-bar ui-bar-a ui-corner-all">Spread Criteria</h3>
<div class="ui-body ui-body-a ui-corner-all">
<div class="ui-field-contain">
<div class="ui-field-contain">
<label>Symbols:</label>
<select name="symbols" multiple="multiple" data-native-menu="false" style="width:50px;">
<option>Symbols</option>
<option value="1">NFLX</option>
<option value="2" selected="selected">SPY</option>
<option value="3" selected="selected">SPX</option>
<option value="2" selected="selected">SPY</option>
<option value="3" selected="selected">SPX</option>
<option value="2" selected="selected">SPY</option>
<option value="3" selected="selected">SPX</option>
<option value="2" selected="selected">SPY</option>
<option value="3" selected="selected">SPX</option>
</select>
</div>
<div class="ui-field-contain">
<label>Spread Types:</label>
<select name="spreadtype" multiple="multiple" data-native-menu="false" style="width:50px;">
<option>Spread Types</option>
<option value="Bull Put" selected="selected">Bull Put</option>
<option value="Bear Call" selected="selected">Bear Call</option>
</select>
</div>
</div>
</div>

<!--Entry Criteria:-->
<h3 class="ui-bar ui-bar-a ui-corner-all">Entry Criteria</h3>
<div class="ui-body ui-body-a ui-corner-all">
<div class="ui-field-contain">
<div data-role="rangeslider" data-track-theme="a" data-theme="b">
<label>Expiration Distance:</label>
<input name="expirationdistancelow" min="0" max="100" value="0" type="range" />
<label for="range-7b">Rangeslider:</label>
<input name="expirationdistancehigh" min="0" max="100" value="35" type="range" />
</div>
</div>
<label>
<input type="checkbox" name="includeweeklyexpirations">Include Weekly Expirations
</label>

<div class="ui-field-contain">
<label>Maximum Delta:</label>
<input type="range" name="entrymaximumdelta" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="0.25" value="0.08" step="0.01">
</div>

<div class="ui-field-contain">
<div data-role="rangeslider" data-track-theme="a" data-theme="b">
<label>Spread Width:</label>
<input name="spreadwidthlow" min="0" max="25" value="5" type="range" />
<label for="range-7b">Rangeslider:</label>
<input name="spreadwidthhigh" min="0" max="25" value="15" type="range" />
</div>
</div>

<div class="ui-field-contain">
<label>Minimum Distance (%):</label>
<input type="range" name="entryminimumdistance" class="singleslider" data-track-theme="a" data-theme="b" min="5" max="50" value="12" step="0.01">
</div>

<div class="ui-field-contain">
<label>Minimum Premium:</label>
<input type="range" name="entryminimumpremium" class="singleslider" data-track-theme="a" data-theme="b" min="0.05" max="1" value="0.25" step="0.01">
</div>

<label>
<input type="checkbox" name="entryminimumpremiumtrigger" checked>Enable Minimum Premium Criteria</label>

<div class="ui-field-contain">
<label>
Minimum Target Profit (%):</label>
<input type="range" name="entryminimumprofit" class="singleslider" data-track-theme="a" data-theme="b" min="1" max="10" value="2" step="0.25">
</div>

<label>
<input type="checkbox" name="entryminimumprofittrigger">Enable Minimum Profit Criteria</label>

<div class="ui-field-contain">
<label>Minimum Short Leg Volume:</label>
<input type="range" name="entryminimumshortlegvol" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="500" value="10" step="5">
</div>

<label>
<input type="checkbox" name="entryminimumshortlegvoltrigger" checked>Enable Minimum Short Leg Volume</label>

<div class="ui-field-contain">
<label>Minimum Long Leg Volume:</label>
<input type="range" name="entryminimumlonglegvol" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="1000" value="10" step="5">
</div>

<label>
<input type="checkbox" name="entryminimumlonglegvoltrigger" checked>Enable Minimum Long Leg Volume</label>

</div>

<!--Exit Stop Loss Criteria:-->
<h3 class="ui-bar ui-bar-a ui-corner-all">Exit Criteria</h3>
<div class="ui-body ui-body-a ui-corner-all">
<div class="ui-field-contain">
<label>Minimum Short Leg Volume:</label>
<input type="range" name="exitminimumshortlegvol" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="1000" value="10" step="5">
</div>

<label>
<input type="checkbox" name="exitminimumshortlegvoltrigger" checked>Enable Minimum Short Leg Volume</label>

<div class="ui-field-contain">
<label>Minimum Long Leg Volume:</label>
<input type="range" name="exitminimumlonglegvol" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="1000" value="10" step="5">
</div>

<label>
<input type="checkbox" name="exitminimumlonglegvoltrigger" checked>Enable Minimum Long Leg Volume</label>

</div>

<!--Exit Stop Loss Criteria:-->
<h3 class="ui-bar ui-bar-a ui-corner-all">Exit Stop Loss Criteria</h3>
<div class="ui-body ui-body-a ui-corner-all">
<div class="ui-field-contain">
<label>Maximum Delta:</label>
<input type="range" name="exitmaximumdelta" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="0.25" value="0.08" step="0.01">
</div>

<label>
<input type="checkbox" name="exitmaximumdeltatrigger">Enable Maximum Delta</label>

<div class="ui-field-contain">
<label>Maximum Distance:</label>
<input type="range" name="exitmaximumdistance" class="singleslider" data-track-theme="a" data-theme="b" min="10" max="100" value="25">
</div>

<label>
<input type="checkbox" name="exitmaximumdistancetrigger">Enable Maximum Distance</label>

<div class="ui-field-contain">
<label>Stop Loss Multiplier:</label>
<input type="range" name="exitstoplossmultiplier" class="singleslider" data-track-theme="a" data-theme="b" min="2" max="10" step="0.5" value="3">
</div>

<label>
<input type="checkbox" name="exitstoplossmultipliertrigger" checked>Enable Stop Loss Multiplier</label>
</div>

<!--Exit Early Criteria:-->
<h3 class="ui-bar ui-bar-a ui-corner-all">Exit Early Criteria</h3>
<div class="ui-body ui-body-a ui-corner-all">
<div class="ui-field-contain">
<label>Acceptable Premium To Leave Behind:</label>
<input type="range" name="earlyexitpremiumloss" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="0.1" value="0.05" step="0.01">
</div>

<label>
<input type="checkbox" name="earlyexitpremiumlosstrigger">Enable Premium To Leave Behind</label>

<div class="ui-field-contain">
<label>Acceptable Profit To Leave Behind (%):</label>
<input type="range" name="earlyexitprofitloss" class="singleslider" data-track-theme="a" data-theme="b" min="0" max="1.0" value="0.5" step="0.1">
</div>

<label>
<input type="checkbox" name="earlyexitprofitlosstrigger">Enable Profit to Leave Behind</label>

<div class="ui-field-contain">
<label><span class="dropt" title="Close early if at least this many days left">
Minimum Days Remaining:</span></label>
<input type="range" name="earlyexitminimumdays" class="singleslider" data-track-theme="a" data-theme="b" min="1" max="10" value="5" step="0.1">
</div>

<label>
<input type="checkbox" name="earlyexitminimumdaystrigger">Enable Minimum Days Remaining</label>
</div>

<div class="ui-grid-a ui-responsive">
<div class="ui-block-a">
<input type="reset" value="Reset">
</div>
<div class="ui-block-b">
<input type="submit" name="submit" value="Submit">
</div>
</div>

</div>
</div>




Page Submitted to: strategyreview.php

<?php

$symbol="";
$delta=0.08;
$distance=12;
$premium=0.25;
$daysToExpiration=35;
$spread=15;
$mininterest = 20;
$monthly = "yes";
$monthlyCheck = "checked";
$menuCheck = "checked";
$minvolume=0;

if(isset($_POST['update'])){
echo "Set values.";
} else {
echo "No values set.";
}

echo "words words strat review";

$strategyname = $_POST['strategyname'];
$symbols = $_POST['symbols'];
$spreadtype = $_POST['spreadtype'];
$expirationdistancelow = $_POST['expirationdistancelow'];
$expirationdistancehigh = $_POST['expirationdistancehigh'];
$includeweeklyexpirations = $_POST['includeweeklyexpirations'];
$entrymaximumdelta = $_POST['entrymaximumdelta'];
$spreadwidthlow = $_POST['spreadwidthlow'];
$spreadwidthhigh = $_POST['spreadwidthhigh'];
$entryminimumdistance = $_POST['entryminimumdistance'];
$entryminimumpremium = $_POST['entryminimumpremium'];
$entryminimumpremiumtrigger = $_POST['entryminimumpremiumtrigger'];
$entryminimumprofit = $_POST['entryminimumprofit'];
$entryminimumprofittrigger = $_POST['entryminimumprofittrigger'];
$entryminimumshortlegvol = $_POST['entryminimumshortlegvol'];
$entryminimumshortlegvoltrigger = $_POST['entryminimumshortlegvoltrigger'];
$entryminimumlonglegvol = $_POST['entryminimumlonglegvol'];
$entryminimumlonglegvoltrigger = $_POST['entryminimumlonglegvoltrigger'];
$exitminimumshortlegvol = $_POST['exitminimumshortlegvol'];
$exitminimumshortlegvoltrigger = $_POST['exitminimumshortlegvoltrigger'];
$exitminimumlonglegvol = $_POST['exitminimumlonglegvol'];
$exitminimumlonglegvoltrigger = $_POST['exitminimumlonglegvoltrigger'];
$exitmaximumdelta = $_POST['exitmaximumdelta'];
$exitmaximumdeltatrigger = $_POST['exitmaximumdeltatrigger'];
$exitmaximumdistance = $_POST['exitmaximumdistance'];
$exitmaximumdistancetrigger = $_POST['exitmaximumdistancetrigger'];
$exitstoplossmultiplier = $_POST['exitstoplossmultiplier'];
$exitstoplossmultipliertrigger = $_POST['exitstoplossmultipliertrigger'];
$earlyexitpremiumloss = $_POST['earlyexitpremiumloss'];
$earlyexitpremiumlosstrigger = $_POST['earlyexitpremiumlosstrigger'];
$earlyexitprofitloss = $_POST['earlyexitprofitloss'];
$earlyexitprofitlosstrigger = $_POST['earlyexitprofitlosstrigger'];
$earlyexitminimumdays = $_POST['earlyexitminimumdays'];
$earlyexitminimumdaystrigger = $_POST['earlyexitminimumdaystrigger'];

echo "$strategyname<br>";


?>

Answer

Add data-ajax = "false" to the form tag like

<form action="strategyreview.php" method="post" data-ajax = "false">