CasperJS cannot click on a DIV button

问题:

I have been working on a website scraping project using CasperJS. It is an ASPX website. I could login to the site and then fill the form that runs a search but after filling the form I cannot simulate a click on the DIV button. The search runs using AJAX but when I capture page after waiting few seconds it does not show results in the captured image. The Search button is made of DIV and upon clicking it runs other hidden JavaScript functions that send the AJAX request to retrieve the search results.

Here is my code.

var casper = require('casper').create({
    clientScripts: ['js/jquery-1.11.3.min.js']
});

var x = require('casper').selectXPath;

casper.userAgent('Mozilla/5.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0; GTB7.4; InfoPath.2; SV1; .NET CLR 3.3.69573; WOW64; en-US)');

casper.start('https://example.com/finder.aspx');

casper.then(function () {
    this.sendKeys('#UserName', 'xxxxx');
    this.sendKeys('#Password', 'yyyyy');
    console.log('Fill login credentials');
    casper.capture("screen1.png");

    this.thenClick('input[type=submit]');
});

casper.wait(3000, function () {
    console.log('Login');
    casper.capture("screen2.png");
});

casper.then(function () {
    this.fill('form[name="searchForm"]', {
        '$ddType': 'ABCD',
        '$rbGender': '0',
    }, true);
});

casper.wait(3000, function () {
    this.sendKeys('#Type_I', 'ABCD');
    this.sendKeys('#ProviderId', '1111111111');
    this.sendKeys('#txtNameFirst', 'My');
    this.sendKeys('#txtNameLast', 'Name');
    this.sendKeys('#txtZipCode', '11111');
    this.sendKeys('#txtBirthDate', '01/11/1987');
    console.log('Form filled');
    casper.capture("screen3.png");
});

casper.thenClick('#btnSubmit', function () {
    console.log('Submitted');
});

casper.wait(3000, function () {
    casper.capture("screen4.png");
});

This is the button DIV that needs a click.

<div id="btnSubmit" class="dxb">
    <span>Submit</span>
</div>

The screen4.png (as same as screen3.png) shows only a filled search form but no "Loading.." message (which supposed to be shown upon submit click) or any result. How can I trigger the form submit? Normal form submit does not retrieve the search results.

---

PS: I tried the following methods to trigger the submit button inside evaluate().

Enter press while in a text box (which in reality shows the result)

Method 1

var e = jQuery.Event("keydown");
e.which = 13;
$("#txtZipCode").trigger(e);

Method 2

this.sendKeys('#txtZipCode', casper.page.event.key.Enter, {keepFocus: true});

Clicking on the DIV button.

Method 1

$('#btnSubmit div input').trigger('click');

Method 2

$('#btnSubmit').click();

Method 3

var mouse = require("mouse").create(casper);
this.mouse.click("#btnSubmit");

Still no luck.

回答1:

casper.then( function () { this.clickLabel('Submit', 'span'); });

I came across a similar issue and this worked for me.