How to set value of an input tag in casperJs

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).


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

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