How can I change a related field, send an API webhook to Slack, and redirect to the report I was working on?

  • 0
  • 1
  • Question
  • Updated 2 years ago
  • Answered
I have some scripts that I've done (and found) that do everything I want them to separately, but I can't get them to work together.

I have a URL button that goes to a record in a related table and changes a field, then reloads the page to show the change.

I also have an HTML page with some javascript functions that capture fields from the URL and pass them to a webhook bot in my Slack app, then redirects back to window.history.back().

When I load these things separately, they work fine.

I can't use the HTML file as my redirect, as this edits the record and simply stops at the XML "no redirect" page. It does edit the record.

I'm beginning to think that I'm simply doing this the wrong way, and that I'm trying to do things that this is just not supposed to do.

Is there something I'm missing or is this best handled a smarter way?

Button script:

var text URLONE = 

URLRoot() & "db/" & [_DBID_DESIGNS] & "?act=API_EditRecord&rid=" & [Related Design]

& "&_fid_10=" & "Yes"

& "&apptoken=mytoken";



var text URLTWO =

URLRoot() & "db/" & [_DBID_DESIGNS] & "?act=dbpage&pagename=slack.html&desig=" 

& URLEncode([Design Name]) 

& "&nnum=" 

& URLEncode([Design #]) 

;

$URLONE & "&rdr=" & ($URLTWO)




Script for passing variables through URL:

http://stackoverflow.com/questions/2405355/how-to-pass-a-parameter-to-a-javascript-through-a-url-and...


var GET = {};var query = window.location.search.substring(1).split("&");for (var i = 0, max = query.length; i < max; i++){      if (query[i] === "") // check for trailing & with no param         continue;     var param = query[i].split("=");     GET[decodeURIComponent(param[0])] = decodeURIComponent(param[1] || "");} Post to Slack javascript function: 

function postMessageToSlack(){

    var MSG = GET.nnum + " " + GET.desig + " is ready";

    var xmlhttp = new XMLHttpRequest(),

        myJSONStr= 'payload={"text": "' + MSG + '", "channel": "#general", "username": "Art Department" }';

        webhook_url = "http://mywebhookurl.slack.com",

    xmlhttp.open('POST', webhook_url, false);

    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

    xmlhttp.send(myJSONStr);

    window.history.back();

}

Photo of Eric

Eric

  • 0 Points

Posted 2 years ago

  • 0
  • 1
Photo of QuickBaseCoach App Dev./Training

QuickBaseCoach App Dev./Training, Champion

  • 51,296 Points 50k badge 2x thumb
Try this syntax and see if it helps.

$URLONE
& "&rdr=" & URLEncode($URLTWO)
Photo of Eric

Eric

  • 0 Points
D'oh! That does help. I feel pretty dumb. I had to have added and deleted URLEncode at least twice. But it redirects back and does not reload the page to show the change. Acceptable, but I have to now figure out how to put a history.back() and reload into my webpage.
Photo of QuickBaseCoach App Dev./Training

QuickBaseCoach App Dev./Training, Champion

  • 51,296 Points 50k badge 2x thumb
OK, well at least I moved you ahead a bit.
Photo of Eric

Eric

  • 0 Points
The solution seems to be replacing window.history.back with window.location.href = document.referrer;
Photo of Eric

Eric

  • 0 Points
I think you've helped me solve my problem, I really appreciate it.
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 26,402 Points 20k badge 2x thumb
Just put all your JavaScript into a user defined page and call it with $.getScript(url) on a button click. If you do this you code will shrink to just a few lines of code that directly reflect the actions you want to perform - no more side problems such as (a) parsing parameters out of the URL or (b) manipulating the history. You are only making this task complicated by playing around with formulas.
Photo of Eric

Eric

  • 0 Points
That would be fine, but there are no side problems. All the above worked just fine, there was just a syntax error, and a user commented I needed to add URLEncode() and I did and it works just fine. Your solution is essentially scrapping a working solution.

I did start with $.getScript but I couldn't figure out the syntax. So I ended up here.

Right now I essentially have a page that I can pass URL parameters to easily that will post to Slack. What you're saying makes sense but this works and I understand well how to control it.
Photo of Eric

Eric

  • 0 Points


With a little help in the comments, I've solved my own problem.


Button script: pass parameters to parse in javascript in URLTWO.


var text URLONE =

URLRoot() & "db/" & [_DBID_DESIGNS] & "?act=API_EditRecord&rid=" & [Related Design]

& "&_fid_10=" & "Yes"

& "&apptoken=mytoken";

//the above is whatever you want. I'm editing a related record in another table


var text URLTWO =

URLRoot() & "db/" & [_DBID_DESIGNS] & "?act=dbpage&pagename=slack.html&desig="

& URLEncode([Design Name])

& "&nnum="

& URLEncode([Design #])

;

//this simply hits the QB page, which loads the scripts on on the window load, runs the function


$URLONE & "&rdr=" & URLEncode($URLTWO)




Script in a JS file or as a <script> in an HTML file:

var GET = {};var query = window.location.search.substring(1).split("&");for (var i = 0, max = query.length; i < max; i++){      if (query[i] === "") // check for trailing & with no param         continue;     var param = query[i].split("=");     GET[decodeURIComponent(param[0])] = decodeURIComponent(param[1] || "");} function postMessageToSlack(){

    var MSG = GET.nnum + " " + GET.desig + " is ready";

//add the fields you want with the GET.field format as shown above here as long as they're

//separated by & and have the format field=result so that GET.field = "result"

//you can easily pass QB data with URLEncode([Relevant Field])


    var xmlhttp = new XMLHttpRequest(),

        myJSONStr= 'payload={"text": "' + MSG + '", "channel": "#general", "username": "Bot Name Here" }';

        webhook_url = "http://mywebhookurl.slack.com",

    xmlhttp.open('POST', webhook_url, false);

    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

    xmlhttp.send(myJSONStr);

    window.location.href = document.referrer;

}





Simply create that HTML file that runs function postMessageToSlack() on loading and it will send the POST to the Slack webhook and then move back in your history and refresh the report you pushed the button on.