brianhansonxyz/homeproz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add currency and percentage input plugins to mortgage calculator

Browse Source 
- Currency inputs auto-format with thousand separators on input
- Only allows numeric characters (strips letters, symbols, etc.)
- .val() returns raw integer for calculations
- Percentage inputs allow only numbers and one decimal point
- Select all on focus for easy replacement
- Maintains cursor position while typing
- Real-time sync between down payment dollar and percent fields

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Hanson.xyz Dev
2025-12-01 00:37:22 -06:00
parent ebbc9ec03b
commit cf0debb970
6 changed files with 217 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
wp-content/themes/homeproz/page-mortgage-calculator.php
+2 -2
View File
@@ -47,7 +47,7 @@ $bg_style = $hero_bg ? 'style="background-image: url(' . esc_url($hero_bg) . ');
<label for="home-price">Home Price</label>
<div class="input-wrapper input-currency">
<span class="input-prefix">$</span>
<input type="text" id="home-price" name="home-price" value="250,000" inputmode="numeric">
<input type="text" id="home-price" name="home-price" value="250000" inputmode="numeric">
</div>
</div>
@@ -56,7 +56,7 @@ $bg_style = $hero_bg ? 'style="background-image: url(' . esc_url($hero_bg) . ');
<div class="input-row">
<div class="input-wrapper input-currency">
<span class="input-prefix">$</span>
<input type="text" id="down-payment" name="down-payment" value="50,000" inputmode="numeric">
<input type="text" id="down-payment" name="down-payment" value="50000" inputmode="numeric">
</div>
<div class="input-wrapper input-percent">
<input type="text" id="down-payment-percent" name="down-payment-percent" value="20" inputmode="decimal">