Joseph U.
Joseph U.

Reputation: 4607

How do I detect an inputfield value change event if changed via jquery?

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

Answers (1)

divix
divix

Reputation: 1364

Simply use: $("input#DonationAmount").trigger('change'); and that should do it.

Upvotes: 1

Related Questions