Forum Discussion

BlakeEstep's avatar
BlakeEstep
Qrew Trainee
6 years ago

Pass value from code page into field

I have a code page made of HTML/Javascript saved as a .html. I have a field button that loads the code. All that is working. What I need help with is getting the final value and placing it into another field (numeric).

I am probably missing something easy but can't figure it out. The code is below.

Code Page: saved as .html
<form align=center>
  <input type="button" onclick="decrementValueTen()" value="-10" />
  <input type="button" onclick="decrementValueFive()" value="-5" />
  <input type="button" onclick="decrementValueOne()" value="-1" />
  <input type="text" id="number" value="0"/>
  <input type="button" onclick="incrementValueOne()" value="+1" />
  <input type="button" onclick="incrementValueFive()" value="+5" />
  <input type="button" onclick="incrementValueTen()" value="+10" />
<br />
  <input type="button" onclick="window.close()" value="Submit" />
</form>

<script>
  var value = parseInt(document.getElementById('number').value, 10);

  function incrementValueOne() {
    value++;
    document.getElementById('number').value = value;
  }

  function incrementValueFive() {
    value = value + 5;
    document.getElementById('number').value = value;
  }

  function incrementValueTen() {
    value = value + 10;
    document.getElementById('number').value = value;
  }

  function decrementValueOne() {
    if (value > 1) {
      value = value - 1;
    } else {
      value = 0;
    }
    document.getElementById('number').value = value;
  }

  function decrementValueFive() {
    if (value > 5) {
      value = value - 5;
    } else {
      value = 0;
    }
    document.getElementById('number').value = value;
  }

  function decrementValueTen() {
    if (value > 10) {
      value = value - 10;
    } else {
      value = 0;
    }
    document.getElementById('number').value = value;
  }
</script>​


Field Button

"https://pies.quickbase.com/db/bnhwf73ut?a=dbpage&pageID=11"
APIs and custom code
  • AustinK's avatar
    AustinK
    Qrew Commander
    5 years ago

    Depending what API call you are trying to make you should be able to do a URL call back or you might have to load a library to do this on your code page. It looks like you just need a new function for building the URL and then submitting it. Instead of having your last Submit button do window.close() you could have it call a function that takes the final value of "number" and posts it to a record. You should be able to do this with API_EditRecord. Which does have a URL Alternative shown so it will work here without a library.

    You will need a record ID(rid) as well or you will never know where to send this data. To do that what I usually do is have my formula URL button that takes me to the code page also send along the rid. Instead of your button being "https://pies.quickbase.com/db/bnhwf73ut?a=dbpage&pageID=11" you could do "https://pies.quickbase.com/db/bnhwf73ut?a=dbpage&pageID=11&recID=[Record ID#]" and that should send along the rid to your code page. What you then would do is use a function to parse the URL for "recID=" and grab that number. This will be the record you clicked the button from, and the one you want to update as well.

    I have used this library with success in the past. The browserified version they offer, I even hosted it in my own Quick Base table and loaded it from there. That library makes it easy but may be a little heavy handed unless you need it. quickbase.dev is a website that gives more info on using this library too.

    This recent post explains how you can set values of a record via a URL. You would have to do something similar on your code page, hopefully that helps. If not I can give a better explanation just let me know.

    ​

    • BlakeEstep's avatar
      BlakeEstep
      Qrew Trainee
      5 years ago
      Thanks for the reply.
      I added the recID to the URL button and started on the code page function. What do you mean exactly by parse the URL for "recID="? is that something I am doing in my submit function? I copied some other code from a different javascript function we use and I'm trying to adapt it for this. Let me know if i'm close. 
        function submitData(){
    var dbid = "dbid";
    var dbidTable = "dbidTable";
    var apptoken = "apptoken";
    $.ajaxSetup({data: {apptoken: apptoken}});
    var promise = $.get(dbidTable, {
      act: "API_EditRecord",
      rid: QBU_rid,
      _fid_8: number,
    window.close()
    }
  $.when(promise).then(function submitData(){
     $.get() & location.reload(true);
    });
  }​

      *note: the dbid, dbidtable, and apptoken have been changed to generic names as to not show the actual apptoken.



      ------------------------------
      Blake E
      ------------------------------
      • AustinK's avatar
        AustinK
        Qrew Commander
        5 years ago
        There are a few different ways to parse a url but so as not to reinvent the wheel we can just take someones code and use it for this. If you want to play around with it I would look into window.location.href or others. You could then parse the URL however you wanted, but the below site has it done for you.

        This page has a function you can copy and when ran it will give you to value of whatever you search for. So if you did getQueryVariable("recID") on a URL like this "https://yourCompany.quickbase.com/db/tableID?a=er&r=yau&recID=12345" it would return 12345. Then you could store that number and use it in your next call to edit that record.

        I'm pretty exhausted today so I may miss something obvious here. Looking at your SubmitData function the only thing that really jumps out is I am not sure you can do window.close inside of there like that. You might look into the "success" or "complete" parameter for jquery ajax. There may be a better way though.