title: CasperJS dynamic selectlists
body: <p>Need help</p>
  
  <p>I am scraping data from this website which has a form that contains three selectlists interconnected to each other that is if the any option from the from the first select list is selected this function is called <code>onchange="Javascript:submitForm2();</code> and the second selectlist is populated. </p>
  
  <p>And subsequently if an option from the second selectlist is selected the same js function is called <code>onchange="Javascript:submitForm2();"</code> And finally two submit buttons for this form each call different js function which populate the result. So I checked out the docs and I did not find any info about selectlists.</p>
  
  <p>Three dynamically changing select lists interconnected to each other</p>
  
  <p><code>&lt;select name="s1" onChange="Javascript:submitForm2();" style="width: 150px" width="150"&gt;
  &lt;select name="s2" onChange="Javascript:submitForm2();" style="width: 300px" width="300"&gt;
  &lt;select name="s3" style="width:300px" width="300"&gt;</code></p>
  
  <p>And the form has two submit buttons   </p>
  
  <p>Tried with these codes <code>this.click('select#s1 option[value="26"]'); this.debugHTML();</code></p>
  
  <p>Gives me this error <code>CasperError: Cannot dispatch click event on nonexistent selector: select#s1 option[value="26"]</code></p>
  
  <p>I also tried <code>document.querySelector('select[name="s1"]').setAttribute('value', "26");</code> 
  Which gives <code>TypeError: 'null' is not an object (evaluating'document.querySelector('select[name="s1"]').setAttribute')</code></p>