/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] auto populate html form w/ javascript

Hello All,

I have a form where the number of input fields (lets call them B through N) is determined by the length of a php array. Above those input fields is another field (lets call this field input A) that I would like to be auto populated based on what the user enters in fields B through N.

Here is my code. The first table (with all of the “totals” fields) holds all of the input fields that I would like to auto update. These fields should auto update so that every input in EACH of the “fy” fields in the second table is added together. Example: every input in the id=”fy_{$fy.fy}_high_impact_cost” field should be added together as the user enters them, and the id=”totals_high_impact_cost” field should be auto updated with that total.

[CODE]<form method=”post” name=”submit” action=”new_item.php” accept-charset=’UTF-8′>

<table border=”box” width=”100%”>
<tr>
<td align=”center”>$<input id=”totals_high_impact_cost” size=”3″ name=”totals_high_impact_cost” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_most_likely_impact_cost” size=”3″ name=”totals_most_likely_impact_cost” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_low_impact_cost” size=”3″ name=”totals_low_impact_cost” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_actual_expense” size=”3″ name=”totals_actual_expense” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_high_mitigation_cost” size=”3″ name=”totals_high_mitigation_cost” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_most_likely_mitigation_cost” size=”3″ name=”totals_most_likely_mitigation_cost” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_low_mitigation_cost” size=”3″ name=”totals_low_mitigation_cost” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_cost_in_scope” size=”3″ name=”totals_cost_in_scope” maxlength=”20″ style=”text-align: right” />M</td>
<td align=”center”>$<input id=”totals_unfunded_threat” size=”3″ name=”totals_unfunded_threat” maxlength=”20″ style=”text-align: right” />M</td>
</tr>
</table>

{foreach value=fy from=$php_array}
<table>
<tr>
<td align=”center”>$<input id=”fy_{$fy.fy}_high_impact_cost” size=”3″ name=”fy_{$fy.fy}_high_impact_cost” maxlength=”20″ style=”text-align: right” value=”{$fy.high_impact_cost}” onchange=”update_totals_high_impact_cost()” />M</td>
<td align=”center”>$<input id=”fy_{$fy.fy}_most_likely_impact_cost” size=”3″ name=”fy_{$fy.fy}_most_likely_impact_cost” maxlength=”20″ style=”text-align: right” value=”{$fy.most_likely_impact_cost}” />M</td>
<td align=”center”>$<input id=”fy_{$fy.fy}_low_impact_cost” size=”3″ name=”fy_{$fy.fy}_low_impact_cost” maxlength=”20″ style=”text-align: right” value=”{$fy.low_impact_cost}” />M</td>
<td align=”center”>$<input id=”fy_{$fy.fy}_actual_expense” size=”3″ name=”fy_{$fy.fy}_actual_expense” maxlength=”20″ style=”text-align: right” value=”{$fy.actual_expense}” />M</td>
<td align=”center”>$<input id=”fy_{$fy.fy}_high_mitigation_cost” size=”3″ name=”fy_{$fy.fy}_high_mitigation_cost” maxlength=”20″ style=”text-align: right” value=”{$fy.high_mitigation_cost}” />M</td>
<td align=”center”>$<input id=”fy_{$fy.fy}_most_likely_mitigation_cost” size=”3″ name=”fy_{$fy.fy}_most_likely_mitigation_cost” maxlength=”20″ style=”text-align: right” value=”{$fy.most_likely_mitigation_cost}” />M</td>
<td align=”center”>$<input id=”fy_{$fy.fy}_low_mitigation_cost” size=”3″ name=”fy_{$fy.fy}_low_mitigation_cost” maxlength=”20″ style=”text-align: right” value=”{$fy.low_mitigation_cost}” />M</td>
<td align=”center”>$<input id=”fy_{$fy.fy}_cost_in_scope” size=”3″ name=”fy_{$fy.fy}_cost_in_scope” maxlength=”20″ style=”text-align: right” value=”{$fy.cost_in_scope}” />M</td>
</tr>
</table>
{/foreach}

</form>[/CODE]

Please email me at [email][email protected][/email] if you need some more information. Thanks in advance for any help!!! =)

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@cmartinoauthorApr 23.2012 — Nevermind. I came up with a solution. Thanks anyways!
×

Success!

Help @cmartino spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.9,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...