3

I am targeting this website: https://ib.ing.cz/transactional-cz/#login/credentials

It has an input form that I can fill in using

document.querySelector('input[name=customer-id]').value = "1234567890";

However, the button that would let me go further is disabled. No matter what I try, it stays so until I start to fill in the form manually. How can I enable the button (and ideally click it programatically too)? I tried simulating keypresses or manipulating the "disabled" attribute of the button but I did not suceed.

UPDATE: I finally got it working, the code I am using is here: https://greasyfork.org/en/scripts/375326-p%C5%99ihla%C5%A1-se-na-ing (for some reason, I had to remove the if/else statement fro the answer, the condition was not true in the context of the script, even though it was in Firefox console)

However, there was some more magic that prevented this from working when I click the button (manually or via the script), getting an error message saying "the website is out of order".

It turned out one also needed to add "change" event. The original link in the answer leads to a oldish question referencing Firebug, which has since been incorporated into Firefox. The key for me was using the debugger. One just clicks right on the website and selects "inspect this element". Events associated with those elements then can be found after clicking on these little triangles in the inspector: enter image description here

And for reading the websites code, it is best to put the scrabmle they send into a beautifier like this: https://beautifier.io/

sup
  • 680
  • 1
  • 6
  • 17

1 Answers1

2

Reference Choosing and activating the right controls on an AJAX-driven site.

Your target site runs its "Client number" validation (to enable that button, etc.) on a keyup event placed on an ancestor div of the input.

This means that you must send a keyup event after setting the value, and make sure that the event bubbles up from the input.

Like so:

var cIdInpt = document.querySelector ('input[name=customer-id]');
if (cIdInpt) {
    var keyupEvnt   = new Event ('keyup', {bubbles: true} );  //  no key code needed in this case.
    cIdInpt.value   = "1234567890";

    cIdInpt.dispatchEvent (keyupEvnt);
}
else {
    console.error ("cIdInpt not found.");
}
Brock Adams
  • 90,639
  • 22
  • 233
  • 295
  • Thanks a lot! This moved me a lot further. However, now the website claims it is out of order (I updated the original question with details). I actually read the link you posted and got to ib.ing.cz/transactional-cz/modules/login/… but unfortunately it is just gibberish to me (and unformated), I am not that skilled with javascript. – sup Dec 09 '18 at 10:03
  • Unfortunately I am still stuck at the error message :-(. – sup Dec 12 '18 at 14:26
  • @sup, your question was answered. [Don't move the goalposts](https://meta.stackoverflow.com/a/258279/331508). ... Furthermore, the **new** problem, is *probably* solvable using the same technique of identifying the necessary event sequence. Ask a new question if you must, don't change the scope of this one. – Brock Adams Dec 12 '18 at 23:50
  • Ok. I finally understood where you got those events from. I thought it was from reading the code of the website but they sit right there in the inspector! The answer linked is about firebug that has a different interface now, which confused me. But thanks for pointing me in the right direction. – sup Dec 13 '18 at 11:18