How to trigger onchange event via Browser Javascript Console

Question

It's HTML Code:

<tr>
<td class="caption">Amount</td>
<td><input type="text" name="Amount" value="" size="30" id="Amount" 
onkeypress="return isNumberKey(event);" onchange="this.value = 
changeAmount(this.value);" maxlength="18"></td>
</tr>
<tr>
<td>Amount Word</td>
<td><textarea name="AmountWord" cols="" rows="" wrap="soft" 
class="text_sotien" id="AmountWord" readonly=""></textarea></td>
</tr>

My website will have 2 field as above. changeAmount() function is a script on my server. Now, I wanna create a Javascript script for my customer. When they pasted it on your browser console (Ctrl + Shilf + I on Chrome or F12 on Firefog), it will fill new value of Amount field then call function changeAmount() to change value of AmountWord. It's my code but it only can change value of Amount field, not call changeAmount() function to change value of AmountWord field :(

javascript:document.getElementById("Amount").value='111000';document.getElementById("AmountWord").focus; document.getElementById("AmountWord").click();

Please help me

Possible duplicate of How to trigger event in JavaScript?

Ahmet Emre Kilinc
– Ahmet Emre Kilinc

2017-03-31 11:07:40 +00:00
Commented Mar 31, 2017 at 11:07 — Ahmet Emre Kilinc
– Ahmet Emre Kilinc, Commented Mar 31, 2017 at 11:07

gunn · Accepted Answer · 2017-03-31 11:27:43Z

2

With modern browser methods:

const input = document.querySelector("input[name='Amount']")
input.dispatchEvent(new CustomEvent("change"))

Better to just avoid inline JS calls like that though.

answered Mar 31, 2017 at 11:27

gunn

9,2152 gold badges27 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Pranoy Sarkar Over a year ago

var input=document.getElementById("Amount"); a simple note as the input has a ID so no need to use querySelector,replace the first line with this

AskToBeAsked Over a year ago

Thank you for your reply. But it still don't work. I used the code: const input = document.querySelector("input[name='Amount']") input.value = 523553 input.dispatchEvent(new CustomEvent("change")) true It changed value on Amount field to 523553 but still don't call function changeAmount() (So that value of AmountWord not change too). Can you test it again?

AskToBeAsked Over a year ago

Note that I don't want create new event, I only want call function changeAmount() when I changed value of Amount field via Browser Console

Collectives™ on Stack Overflow

How to trigger onchange event via Browser Javascript Console

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related