Reputation: 4607
Using jQuery want to update a hidden text field when the value in a text input field changes.
This works if I enter it manually and click tab. But when I click on one of the buttons that changes the text input value via JQuery it is not activating the event.
$( document ).ready(function() {
$( "body" ).on( "click", "button[data-type='PPA']", function( event ) {
event.preventDefault();
$("input#DonationAmount").val($(this).val());
});
$( "body" ).on( "change", "#DonationAmount", function( event ) {
event.preventDefault();
$("input[name='amount']").val($(this).val());
});
});
The HTML that fires the actions above
<button data-type="PPA" type="button" value="10">$10</button>
<button data-type="PPA" type="button" value="20">$20</button>
<button data-type="PPA" type="button" value="50">$50</button>
<button data-type="PPA" type="button" value="100">$100</button>
<input type="text" id="DonationAmount" value="25"/>
The HTML that I am trying to update
<input type="hidden" name="amount" value="25">
Upvotes: 0
Views: 664
Reputation: 1364
Simply use: $("input#DonationAmount").trigger('change');
and that should do it.
Upvotes: 1