Nightmare .click event onclick

Question

I'm trying to click 'onclick' element. The source of target site is

    <td class="td-03">
        <p class="td-03">hogehoge</p>
    </td>
    <td class="td-04">
        <p class="td-04">
            <input class="btn btn-sm btn-success" onclick="this.form.f_comp_no.value=117111;this.form.f_acnt_no.value=431174;" type="submit" value="select1">
        </p>
    </td>
</tr>
<tr>
    <td class="td-01">
        <p class="td-01">2</p>
    </td>
    <td class="td-02">
        <p class="td-02">162343</p>
    </td>
    <td class="td-03">
        <p class="td-03">foofoo</p>
    </td>
    <td class="td-04">
        <p class="td-04">
            <input class="btn btn-sm btn-success" onclick="this.form.f_comp_no.value=11143;this.form.f_acnt_no.value=423271;" type="submit" value="select2">
        </p>
    </td>
</tr>

I want to click 'select2'.

I tried this, but it doesn't work:

.click('[input[onclick=this.form.f_comp_no.value=11143;this.form.f_acnt_no.value=423271;]')

How to click element of .select2?

Thanks.

It would be much, *much* simpler (and also far better practice) to call a function onlick of the `.select2` element, and then call that function wherever it is required elsewhere in your code. — Rory McCrossan, Jun 07 '16 at 07:24
Im sorry for mistake. The same value name. Difference is onclick element... — rluisr, Jun 07 '16 at 08:01
@ArtjomB.Thanks for reply! I tried it but doesn't work... Then I tried `.click('input[type=submit]')` doesn't work too... — rluisr, Jun 08 '16 at 03:12
@rluisr How do you verify whether the click was successful? How does the page behave normally and what happens when you click? Please show the missing code and ideally an [MCVE](/help/mcve) — Artjom B., Jun 08 '16 at 07:10

score 2 · Answer 1 · answered Jun 07 '16 at 07:32

2

"How to click element of .select2?"

$(".btn[value='select2']").click();

answered Jun 07 '16 at 07:32

Julien

2,616
1
30
43

Thanks reply. Im sorry for mistake. The same value name. Difference is onclick element... – rluisr Jun 07 '16 at 07:59
@coyotte508 Thanks for reply! I tried `.click('input[value='select1'][1]')` doesn't work... – rluisr Jun 08 '16 at 03:13
@coyotte508 Thank you reply. I tried `.click("input[type='submit']")[1]` but this is error. I use Nightmare. `.click` method doesn't supoort `[i]`. sorry... please teach me... – rluisr Jun 10 '16 at 13:02

score 1 · Answer 2 · edited May 23 '17 at 12:24

One (obvious) thing:

Code can be inside evaluate():

nightmare
   .goto(page)
   .evaluate( () => {
       /* Inside browser context, no access to variables from the nodejs
          program unless they are passed as an argument */
       /* using jQuery if it's loaded in the page */
       $(".btn[value='select1']")[1].click();
       /* using native JS api */
       document.querySelectorAll("input[value='select1']")[1].click();
       /* In both cases the [1] refers to the second element matching the css
          selector */

       /* If returning a value here, will be the parameter of the callback
          function of the next .then() */
   }).doStuff....

Look at the documentation for evaluate(): how to pass arguments to it, how to get back a value from it.

If you want to do the click() from nightmare itself, it's more complicated, you have to find the precise css selector to find your element directly.

Luckily this is possible in CSS3.

So you can do:

nightmare
   .goto(page)
   .click(".btn[value='select1']:nth-of-type(2)")
   .doStuff....

All this is assuming you have two elements of value select1 and want to click the second one, if your second element is actually of value select2 then this would work:

nightmare
   .goto(page)
   .click(".btn[value='select2']")
   .doStuff....

Nightmare .click event onclick

2 Answers2