@SafetyUniversity, here you go…
I’m gonna assume what we’re trying to achieve here is the ability to scan a card/chip and have it submit a form. So in my case, I want the form to have 4 fields.
- Submitted By:
- Location (connection field)
- Date and Time
The submitted By will be a record rule of whoever is logged in. Date and time will also be a record rule to the current date and time. The Location will be the ID of the connection field.
So first let’s get the ID of the location and save that value as a basic text value to the NFC chip. You can do this with some simple code, but it’s just easier to do this with a native app like NFC Tools. Make sure you write it to the card as a text value.
So in my case I have 2 chips, one has the value of “4MXQJdrZ6v” and the other “DVWQWRNZ49”
Now the fun part, i have a form on a page without any fields, but with 3 rules. This is all we need to do on the form part:
The key, is that we’re setting the Location value to the Browser Local Storage value of ‘locationId’
Next, let’s add our Javascript, make sure to update the compoent id at the top to your ID:
TB.render('component_3', function(data) {
const ndef = new NDEFReader();
async function startScanning() {
await ndef.scan();
ndef.addEventListener("reading", ({ message, serialNumber }) => {
const textDecoder = new TextDecoder(message.records[0].encoding);
var cardValue = textDecoder.decode(message.records[0].data);
localStorage.setItem('locationId', cardValue);
data.ele.find('.form-submit .af-form-submit').click();
});
}
startScanning();
});
What we’re essentially doing is after the form is loaded, we enable the scanner, then when we get the scanned value, we save it to the browser local storage and submit the form. The rest happens in the form record rules.
One other minor change I made was to add a class to the form submit button of ‘hide’ so we don’t ever see it.
Here’s a rough demo:
