したがって、同じページではなく別のページに情報を渡す方法を見つけることしかできません。これは完全にクライアント側で行う必要があります。これを使用するとインターネット接続がなくなるため、サーバー側は機能しません。接続が利用可能になったときに送信できるようにフォームデータ。
基本的に、2つのテーブルがあります。1つは左側にあり、ユーザーが必要に応じて変更できる標準の数値セット(フィールドtime1〜time8)があります。これらの値は合計して「designhours」フィールドになります。その数値は、そこで必要なさまざまな計算のために、右側の「designhours」フィールドに入力する必要があります。私の以前の仕事(HTMLやjavascriptではない)では、フィールド名が同じである場合、データが渡されましたが、ここでは明らかにそうではありません。
左側の表を入れる前に、このフォームはうまく機能しましたが、新しい「designhours」値を合計するオプションを追加する必要があります。以前私を助けてくれた人たちに感謝し、今助けてくれた人たちに感謝します。私はまだ学んでいますが、そこに着きつつあります。
ほとんどのフィールドが削除されたサンプルコード。これにより、私が行っていることを確認できます(指摘していただきありがとうございます)完全なコードは以下のとおりです...
したがって、左側の表のフィールド名
time1- time8これらの値は、合計を設計時間に入れるために追加されます
そして右のテーブル
賃金、インストラクター、クラス、designhours (左の表と同じ)、cost、many、atetextfield7、build_cost、buy_cost、build_hours、buy_hours、build_train、buy_train、build_total、buy_total
<script type="text/javascript">
var btn = document.getElementById('calculate');
btn.onclick = function() {
var wageval = parseInt(document.getElementById('wage').value) || 0;
var instructorsval = parseInt(document.getElementById('instructors').value) || 0;
var build_cost = document.getElementById('build_cost');
var buy_cost = document.getElementById('buy_cost');
var msg = [];
if (isNaN(wageval)) {
msg.push('Average instructor hourly wage is not a number');
// the value isn't a number
}
if (isNaN(instructorsval)) {
msg.push('Number of instructors per course is not a number');
// the value isn't a number
}
if (msg.length > 0) {
build_cost.value = msg.join(', ');
buy_cost.value = msg.join(', ');
および以下の計算:
} else {
designhours.value = (time1 + time2 + time3 + time4 + time5 + time6 + time7 + time8);
build_cost.value = (wageval * designhoursval);
buy_cost.value = (costval * hiddenval);
build_hours.value = (designhoursval * manyval);
build_train.value = (classval * hiddenval);
build_total.value = (wageval * designhoursval * manyval + classval);
buy_total.value = (costval * manyval);
var build_costval = parseInt(build_cost.value) || 0;
var buy_costval = parseInt(buy_cost.value) || 0;
var build_hoursval = parseInt(build_hours.value) || 0;
var build_trainval = parseInt(build_train.value) || 0;
var build_totalval = parseInt(build_total.value) || 0;
var buy_totalval = parseInt(buy_total.value) || 0;
var designhoursval = parseInt(designhours.value) || 0;
}
以下の完全なコード
HTML
<form id="form1" name="form1" method="post" action="mailto:?subject=Laerdal%20ROI%20Information" enctype="text/plain">
<table width="859" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="bottom">
<table width="352" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="22" colspan="2"> </td>
</tr>
<tr>
<td width="225" height="22"> </td>
<td width="127" height="22" align="left"> </td>
</tr>
<tr>
<td height="22"><span class="norm">Needs Analysis</span></td>
<td height="22" align="center"><input name="time1" type="text" class="field" id="time1" value="1" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Research</span></td>
<td height="22" align="center"><input name="time2" type="text" class="field" id="time2" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Design</span></td>
<td height="22" align="center"><input name="time3" type="text" class="field" id="time3" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Scenario Programming</span></td>
<td height="22" align="center"><input name="time4" type="text" class="field" id="time4" value="3" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Support Materials</span></td>
<td height="22" align="center"><input name="time5" type="text" class="field" id="time5" value="16" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Validation</span></td>
<td height="22" align="center"><input name="time6" type="text" class="field" id="time6" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Revision</span></td>
<td height="22" align="center"><input name="time7" type="text" class="field" id="time7" value="4" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Implementation</span></td>
<td height="22" align="center"><input name="time8" type="text" class="field" id="time8" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Total</span></td>
<td height="22" align="center"><input name="designhours" class="field" type="text" id="designhours" size="10" /></td>
</tr>
<tr>
<td height="73" colspan="2"> </td>
</tr>
</table>
<p> </p></td>
<td width="55" valign="bottom"> </td>
<td>
<table width="440" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="36" colspan="2" align="right" class="norm">Average Instructor hourly wage:</td>
<td height="36" align="right"><input name="wage" class="field" type="text" id="wage" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Number of Instructors per course:</td>
<td height="36" align="right"><input name="instructors" class="field" type="text" id="instructors" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Scenario Programing Class:</td>
<td height="36" align="right"><input name="class" class="field" type="text" id="class" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Instruction design hours per scenarios:</td>
<td height="36" align="right"><input name="designhours" class="field" type="text" readonly="true" id="designhours" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Average cost of SimStore Scenarios:</td>
<td height="36" align="right"><input name="cost" class="field" type="text" id="cost" value="295" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">How many scenarios do you need:</td>
<td height="36" align="right"><input name="many" class="field" type="text" id="many" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Date needed?:</td>
<td height="36" align="right"><input name="atetextfield7" class="field" type="text" id="atetextfield7" size="12" /></td>
</tr>
<tr>
<td height="40" colspan="3" align="center" class="calc">CALCULATED RESULTS</td>
</tr>
<tr>
<td height="40"><input name="hidden" type="hidden" id="hidden" value="1" /></td>
<td height="40" align="center" class="bold">BUILD</td>
<td height="40" align="center" class="bold">BUY</td>
</tr>
<tr>
<td height="38" align="right" class="norm">Cost per scenario:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_cost" class="field" type="text" id="build_cost" size="12" /></td>
<td height="38" align="center"><input name="buy_cost" class="field" type="text" id="buy_cost" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">Total development hours:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_hours" class="field" type="text" id="build_hours" size="12" /></td>
<td height="38" align="center"><input name="buy_hours" class="field" type="text" id="buy_hours" value="0" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">
Scenario Programming<img src="images/Blank.png" alt="" width="12" height="5" /><br />
Training (8h):<img src="Blank.png" alt="" width="12" height="5" />
</td>
<td height="38" align="center"><input name="build_train" class="field" type="text" id="build_train" size="12" /></td>
<td height="38" align="center"><input name="buy_train" class="field" type="text" id="buy_train" value="0" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">Total Cost:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_total" class="field" type="text" id="build_total" size="12" /></td>
<td height="38" align="center"><input name="buy_total" class="field" type="text" id="buy_total" size="12" /></td>
</tr>
<tr>
<td height="50" colspan="3" align="center" valign="bottom"><input type="reset" />
<img src="images/Blank.png" alt="" width="15" height="25" />
<input name="calculate" type="button" id="calculate" value="Calculate" />
<img src="images/Blank.png" alt="" width="15" height="25" />
<input name="share" type="submit" id="submit" value="Share" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
Javascript
var btn = document.getElementById('calculate');
btn.onclick = function () {
//get the input values
var wageval = parseInt(document.getElementById('wage').value) || 0;
var instructorsval = parseInt(document.getElementById('instructors').value) || 0;
var classval = parseInt(document.getElementById('class').value) || 0;
var designhoursval = parseInt(document.getElementById('designhours').value) || 0;
var costval = parseInt(document.getElementById('cost').value) || 0;
var manyval = parseInt(document.getElementById('many').value) || 0;
var hiddenval = parseInt(document.getElementById('hidden').value) || 0;
var time1val = parseInt(document.getElementById('time1').value) || 0;
var time2val = parseInt(document.getElementById('time2').value) || 0;
var time3val = parseInt(document.getElementById('time3').value) || 0;
var time4val = parseInt(document.getElementById('time4').value) || 0;
var time5val = parseInt(document.getElementById('time5').value) || 0;
var time6val = parseInt(document.getElementById('time6').value) || 0;
var time7val = parseInt(document.getElementById('time7').value) || 0;
var time8val = parseInt(document.getElementById('time8').value) || 0;
// get the elements to hold the results
var build_cost = document.getElementById('build_cost');
var buy_cost = document.getElementById('buy_cost');
var build_hours = document.getElementById('build_hours');
var buy_hours = document.getElementById('buy_hours');
var build_total = document.getElementById('build_total');
var build_train = document.getElementById('build_train');
var buy_total = document.getElementById('buy_total');
var time1 = document.getElementById('time1');
var time2 = document.getElementById('time1');
var time3 = document.getElementById('time1');
var time4 = document.getElementById('time1');
var time5 = document.getElementById('time1');
var time6 = document.getElementById('time1');
var time7 = document.getElementById('time1');
var time8 = document.getElementById('time1');
var designhours = document.getElementById('designhours');
// create an empty array to hold error messages
var msg = [];
// check each input value, and add an error message to the array if it's not a number
if (isNaN(wageval)) {
msg.push('Average instructor hourly wage is not a number');
// the value isn't a number
}
if (isNaN(instructorsval)) {
msg.push('Number of instructors per course is not a number');
// the value isn't a number
}
if (isNaN(classval)) {
msg.push('Scenario programming class is not a number');
// the value isn't a number
}
if (isNaN(designhoursval)) {
msg.push('Instruction design hours per scenario is not a number');
// the value isn't a number
}
if (isNaN(costval)) {
msg.push('Average cost of SimStore scenarios is not a number');
// the value isn't a number
}
if (isNaN(manyval)) {
msg.push('How many scenarios do you need is not a number');
// the value isn't a number
}
if (isNaN(hiddenval)) {
msg.push('joe messed up');
// the value isn't a number
}
if (isNaN(time1val)) {
msg.push('Needs Analysis is not a number');
// the value isn't a number
}
if (isNaN(time2val)) {
msg.push('Research is not a number');
// the value isn't a number
}
if (isNaN(time3val)) {
msg.push('Design is not a number');
// the value isn't a number
}
if (isNaN(time4val)) {
msg.push('Scenario Programming is not a number');
// the value isn't a number
}
if (isNaN(time5val)) {
msg.push('Support Materials is not a number');
// the value isn't a number
}
if (isNaN(time6val)) {
msg.push('Validation is not a number');
// the value isn't a number
}
if (isNaN(time7val)) {
msg.push('Revision is not a number');
// the value isn't a number
}
if (isNaN(time8val)) {
msg.push('Implementation is not a number');
// the value isn't a number
}
// if the array contains any values, display an error message
if (msg.length > 0) {
build_cost.value = msg.join(', ');
buy_cost.value = msg.join(', ');
build_hours.value = msg.join(', ');
build_train.value = msg.join(', ');
build_total.value = msg.join(', ');
buy_total.value = msg.join(', ');
time1.value = msg.join(', ');
time2.value = msg.join(', ');
time3.value = msg.join(', ');
time4.value = msg.join(', ');
time5.value = msg.join(', ');
time6.value = msg.join(', ');
time7.value = msg.join(', ');
time8.value = msg.join(', ');
} else {
designhours.value = (time1 + time2 + time3 + time4 + time5 + time6 + time7 + time8);
build_cost.value = (wageval * designhoursval);
buy_cost.value = (costval * hiddenval);
build_hours.value = (designhoursval * manyval);
build_train.value = (classval * hiddenval);
build_total.value = (wageval * designhoursval * manyval + classval);
buy_total.value = (costval * manyval);
var build_costval = parseInt(build_cost.value) || 0;
var buy_costval = parseInt(buy_cost.value) || 0;
var build_hoursval = parseInt(build_hours.value) || 0;
var build_trainval = parseInt(build_train.value) || 0;
var build_totalval = parseInt(build_total.value) || 0;
var buy_totalval = parseInt(buy_total.value) || 0;
var designhoursval = parseInt(designhours.value) || 0;
}
};
誰でもできるガイダンスをありがとう。私はこれらすべてに苦労しています。