Entered values removed after clicks on another element in the web application

Question

I'm having an input field where we need to enter some values, but then that input field will update with currency value, but when I automate this filled value set to empty once after click on another element. How do I figure this out?

I have attached the screenshot of my application:

And below is my code I'm using:

jse.executeScript("document.getElementById('Amount1').setAttribute('value', '20')");

Even I tried using TAB key events, but still the same behaviour is there.

Are you using IE for execution? And why are trying to set the value using js, normal `.send_keys` method should do the job, right? — supputuri, Apr 16 '20 at 04:19
@supputuri No i'm using Chrome. I used .sendkeys and it was not working then i used js but still it's not working. — cindy87, Apr 16 '20 at 23:56

supputuri · Answer 1 · 2020-04-20T01:35:44.307

0

Try triggering the onchange or associated event using the below funciton.

public static void jsTriggerEventOnElement(WebDriver driver, WebElement element, String eventName) { 
        String jsFunction = " var genericEvent = document.createEvent ('Event');  clickEvent.initEvent ('" + eventName + "', true, true); arguments [0].dispatchEvent (genericEvent); ";
        JavascriptExecutor js = (JavascriptExecutor) driver;
        js.executeScript(jsFunction, element);
}

You can trigger the event by using the below line of code after entering the value in the field.

// enter the value using the normal send_keys/js

// now call the jsTriggerEventOnElement method, here we are triggering the onchange event 
// please change the event based the associated event
jsTriggerEventOnElement(driver, element, 'onchange`)

Please refer to this post that will give an idea to find out the associated events. But, you can always try with onchange as a first check.

Edit

Try with the below.

public static void jsTriggerEventOnElement(WebDriver driver, WebElement element, String eventName) { 
        String jsFunction = " var clickEvent = document.createEvent ('Event');  clickEvent.initEvent ('" + eventName + "', true, true); arguments [0].dispatchEvent (clickEvent); ";
        JavascriptExecutor js = (JavascriptExecutor) driver;
        js.executeScript(jsFunction, element);
    }
jsTriggerEventOnElement(driver,element, 'onblur');

edited Apr 20 '20 at 01:35

answered Apr 17 '20 at 01:41

supputuri

13,644
2
21
39

Even with "onchange" the value I entered disappeared. – cindy87 Apr 17 '20 at 05:19
Can you check this [post](https://stackoverflow.com/questions/55977388/textbox-events/55978587#55978587) and find the associated event. – supputuri Apr 17 '20 at 13:09
try with `blur`. – supputuri Apr 20 '20 at 01:06
So instead on 'onchange' do u need to use 'blur' – cindy87 Apr 20 '20 at 01:20
Still its gives me empty field. I added the 'jsTriggerEventOnElement' just after the sendkeys. – cindy87 Apr 20 '20 at 02:16
hmm, Is it a publicly accessible website? – supputuri Apr 20 '20 at 03:34
were you able to access the link i mentioned above. If then i'll remove that comment as it's our testing environment URL. – cindy87 Apr 21 '20 at 05:16
Please remove it – supputuri Apr 21 '20 at 13:01
even i tried with element.sendKeys(Keys.TAB). Its not working, still update the input field to empty field. – cindy87 Apr 23 '20 at 22:40

score 0 · Accepted Answer · answered May 07 '20 at 00:35

Finally i was able to find an answer for this issue. One main reason was the element was stale once after entering the values so i had to re initialise them again.(but i don't think it's the best coding practice)

javascriptHelper.enterTextToField(amount2, driver.findElement(“id of the amount field”));


    javascriptHelper.clickOnElement(WebElementExtension.WaitForElementId(driver, "id of the amount field",
            driverWaitHelper.waitingTime()));

    WebElement textEleAmount2 = driver.findElement(By.id("id of the amount field"));
    textEleAmount2.sendKeys(Keys.TAB);


    javascriptHelper.clickOnElement(WebElementExtension.WaitForElementId(driver, "id of the name field",
            driverWaitHelper.waitingTime()));

    //Here I’m initialising the element again due to stale element reference
    WebElement amountContractor2 = WebElementExtension.WaitForElementId(driver, "id of the amount field",
            driverWaitHelper.waitingTime());

    // erase any existing value in the amount field
    for (int i = 0; i < amountContractor2.getAttribute("data-value").length(); i++) {
        amountContractor2.sendKeys(Keys.BACK_SPACE);
    }

    amountContractor2.sendKeys("300");

    javascriptHelper.jsTriggerEventOnElement(driver, amountContractor2, "change");

    // click away to fire on change event
    javascriptHelper.clickOnElement(driver.findElement(By.id("id of the name field")));

Entered values removed after clicks on another element in the web application

2 Answers2