How to set value of an input tag in casperJs

Question

I have input element as shown :

<input type="text" class="bg-white" id="couponCode" value="">

How can i set/fill its value using casperJs

Answer 1

Using casper.sendKeys('selector', value);

http://casperjs.readthedocs.org/en/latest/modules/casper.html#sendkeys

Answer 2

There are a few different methods available for accomplishing this task.

You should use casper.sendKeys() unless you need to perform a more complex operation.

---

casper.sendKeys():

If you would like to set the value from the CasperJS environment, and the input element is optionally inside a form element, then you can use casper.sendKeys():

casper.sendKeys('#couponCode', 'Hello, world!'); 

casper.fill():

If you would like to set the value from the CasperJS environment, and the input element is inside a form element, and includes a name attribute, then you can use casper.fill():

casper.fill('#form', {   couponCode: 'Hello, world!', // #form [name="couponCode"] }); 

casper.fillSelectors():

If you would like to set the value from the CasperJS environment, and the input element is inside a form element, and you would like to reference the input element using a CSS3 selector, then you can use casper.fillSelectors():

casper.fillSelectors('#form', {   '#couponCode': 'Hello, world!', // #form #couponCode }); 

casper.fillLabels():

If you would like to set the value from the CasperJS environment, and the input element is inside a form element, and includes an associated label element with text, then you can use casper.fillLabels():

casper.fillLabels('#form', {   couponCode: 'Hello, world!', // #form label[text()="couponCode"] input }); 

casper.fillXPath():

If you would like to set the value from the CasperJS environment, and the input element is inside a form element, and you would like to reference the input element using an XPath selector, then you can use casper.fillXPath():

casper.fillXPath('#form', {   '//*[@id="couponCode"]': 'Hello, world!', // #form #couponCode }); 

casper.evaluate():

If you would like to set the value from the Page DOM environment, and the input element is optionally inside a form element, then you can use casper.evaluate():

casper.evaluate(function () {   document.getElementById('couponCode').value = 'Hello, world!'; }); 

Note: Similarly to evaluate(), you can also use: evaluateOrDie(), thenEvaluate(), or thenOpenAndEvaluate() (if you would like to accomplish two or more operations at once in relation to the steps being executed).