[Bank Statement Download Script] Set link or perform JavaScript?

So I am working on a new statement download script. I have everything finished except for the last two steps.

I have to either set the link or have JavaScript click it. So I am looking for suggestions on how to proceed.

Here a picture of the table:

The top left most item element reads:

<a id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate" href='javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$MainContent$ucEStatements$dlStatements$ctl00$lbStatementDate", "", true, "", "", false, true))'><i class="fa fa-file-pdf-o"></i>10/10/2016</a>

So what's the best way to click the link?

In addition I want to append the institution name to the beginning of the file so Hazel can zero in on that and move the file to a mounted volume.

Any takers on this one?

Well, if you are referring to that specific HTML element, it should be easy since the element has an id attribute:
id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate"

Use the Chrome Inspector to get the XPath for this element, and set a KM Variable "xPath" to that.
Then use that XPath in this Javascript in Browser Action:

clickOnLink(document.kmvar.xPath);

@JMichaelTX
No matter how much I resist chrome keeps re-appearing. Got any Firefox or Safari methods? Not too keen on chrome because of it's proclivity to doing what it wants in spite of Apple's guidelines. Regardless, I am unclear on exactly how to use the code provided. Could you "explain it to me like I was five"?

This method will work just as well with Safari. You'll use a JavaScript in Safari Action. We only need to use Chrome to get the XPath:

  1. Open your web page in Chrome (just one time)
  2. Right-click on the link of interest, and select "Inspect"
  3. This will open the Chrome Developer tool, showing the HTML for the link
  4. Right-click on the HTML for the link, and select "Copy > Xpath"
  5. We are now done with Chrome. You can close it.
  6. In you KM Macro, add a Set Variable to text Action
  7. Paste in the text block -- this is the xpath. It should look someting like this:
    //*[@id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate"]

Here's the macro. You just need to replace the value in the Set Variable text box with the XPath that you copy.

##Macro Library   Click on Link Using XPath [Example]


####DOWNLOAD:
<a class="attachment" href="/uploads/default/original/2X/1/16e578d331dd144fa987b1b02758f96457996713.kmmacros">Click on Link Using XPath [Example].kmmacros</a> (2.2 KB)

---

###ReleaseNotes

Open Safari to the the web path with the link, and trigger this macro.

---

<img src="/uploads/default/original/2X/d/dea1ad3e4ce7b4656712c119a30f2638605da56f.png" width="604" height="677">

---

###Script
For reference, here is the JavaScript which can be used in either a JavaScript in Safari Action or a JavaScript in Chrome Action.

```javascript
clickOnLink(document.kmvar.xPath);

function clickOnLink (pXPathStr) {

  var elemFound =  document.evaluate(
      pXPathStr, document, null, 0, null
    ).iterateNext();
    
  if (elemFound) {
    elemFound.click();
  }
  else {
    alert('Element NOT FOUND for XPath:\n' + pXPathStr);
  }

}
```

@JMichaelTX

Thanks JM. What you have is exactly what it was.

So I copied it using chrome and got:

//*[@id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate"]

Pasted it as:

ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate

Then I copied your JS as:

clickOnLink(document.kmvar.xPath);

function clickOnLink (pXPathStr) {

var elemFound = document.evaluate(
pXPathStr, document, null, 0, null
).IterateNext();

if (elemFound) {
elemFound.click();
}
else {
alert('Element NOT FOUND for XPath:\n' + pXPathStr);
}

};

It didn't work. So a couple of questions. I used returns to format the above JS and get it to look like yours. I assume it's ok to do that unless I need to escape some characters, etc. I also assume I close each statement with " ; " and that bracketed statements require curly braces, is that correct?

You are correct. Everything you have is fine, although technically you don’t need the final semi-colon.

Here’s a reformatted version, which might help you see the logic a little clearer:

clickOnLink(document.kmvar.xPath);

function clickOnLink(pXPathStr) {
    var elemFound = document.evaluate(pXPathStr, document, null, 0, null).IterateNext();

    if (elemFound) {
        elemFound.click();
    } else {
        alert('Element NOT FOUND for XPath:\n' + pXPathStr);
    }
}

No. That is not correct.
The XPath value is exactly what you copied. It should be pasted as is into the KM Set Variable Block:
//*[@id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate"]

There is no need to copy, nor change, the JavaScript.
It is already styled properly in the JavaScript for Browser action.
If you want to use it in another macro, then just copy the KM JavaScript in Safari Action. It is advised to first test code from others as is before making changes.

As a test, just change the "Set Variable" Action in my above macro, and then test it on your web page.

Thanks Dan, Are you using Atom or ?
Really starting to look hard and making learning JavaScript top priority. It's everywhere and very handy to use in Filemaker Pro.

Along with what I pasted I also tried what you listed…
(//*[@id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate"]).

I also tried single quotes thinking maybe that's why it wasn't working. I will take another look at it. Probably some silly error on my part.

Don't change anything in the XPath that you copy using the Chrome tool.
Just copy it, and paste directly into the KM Action Set Variable to Text.

I just posted a more complete macro:

Yes, I use Atom. There’s a topic here somewhere on how to set it up.

@JMichaelTX
No joy. I also tried the new macro you posted. Now here’s the funny thing. I went back to chrome and copied the xPath again. I compared it with what I had and for grins pasted it again. Then I ran my macro and this time I got a pop-up error stating that the xPath: blah, blah, blah couldn’t be found. It listed the xPath I pasted. Then I ran it again and the error dialog did not re-appear. So it appears it tried to run at least that one time which leads me to believe there’s a problem with the xPath I copied from Chrome.

Can you please just use my macro until we get the XPath to work. We need to keep things simple, and not introduce any other variables.

If you are getting a XPath of the right element, and it is a anchor element (<a href="blah blah">displayed text</a>) then it should work.

Can you do a video of the process you use to get/copy the XPath, starting with the right-click on the web page element?

Sure. Here it is…

Thanks, but that is way too small to read.
It would be much better if you can post the actual video (instead of an animated GIF), so I can stop, replay, and study the process.

Also, please post the XPath that you copied.
You will need to put it between back quotes so the forum editor will display properly.

Ok, here's the xPath...
//*[@id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate"]

And just in case you want to see it with the outer element...

<a id="ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate" href='javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$MainContent$ucEStatements$dlStatements$ctl00$lbStatementDate", "", true, "", "", false, true))'><i class="fa fa-file-pdf-o"></i>10/10/2016</a>

What happens when you manually click on the link?
Do you get a popup, file download, or what?

What happens when you trigger my macro with the web page frontmost?

Do you know how to use the JavaScript console in the Chrome Developers tool?

If so, you might try this, entering one line at a time, and then RETURN

var linkElem = document.getElementById("ctl00_MainContent_ucEStatements_dlStatements_ctl00_lbStatementDate")
linkElem    // should show the anchor element
linkElem.click()   // should click the link

Let me know what happens.

1 Like

Please see YouTube Video showing how to get XPath, and then demo of the above macro.