CODEWITHSUNDEEP
javascriptjqueryhtmldom
JohnCena
JohnCena

Reputation: 3

Changes not reflected when setting text input value with javascript/jQuery

I am trying to execute some Javascript in the console on Google Chrome at the checkout page of http://www.adidas.co.uk/.

Using the following to fill the input element with the below ID works fine as expected. $("#dwfrm_delivery_singleshipping_shippingAddress_addressFields_houseNumber").val("value here")

However, on different elements, as shown below, absolutely nothing happens and the text does not appear in the input field.

$("#dwfrm_delivery_singleshipping_shippingAddress_addressFields_firstName").val("value here")

You can see the page by adding a random item to the basket at http://www.adidas.co.uk/ and clicking "Checkout". I do not think providing HTML snippets would be helpful as I expect there to be something elsewhere on the page which is interfering.

I have tried setting the value by setting the value attribute directly, which also has the same effect of not updating the text input. Nevertheless, I am able to access my set values using jQuery's .val() method, just that for some input fields they do not display on the screen.

Why is this happening?

Upvotes: 0

Views: 2072

Answers (2)

emrhzc
emrhzc

Reputation: 1480

You have changed the actual value of the input, but the shown value is not that, since it is angular driven HTML, angularJS controls what to display, yet does not takes console interference into account.

run after modification

$("element").trigger('input');

Upvotes: 0

Božo Stojković
Božo Stojković

Reputation: 2943

@Emrah Izci Try running this:

Array.prototype.slice.call(document.getElementsByTagName("input")).forEach(function(elem, ind, arr) {elem.value = "TEST"});

I'm not sure what this means. Maybe there are hidden inputs that hold the actual value or something?

Upvotes: 1

Related Questions