Is it possible to create a 6 digit Unique Id with Custom JS and set to hidden field to send data on submit form?

  • Issue description:
    Dear Forum Community,

I’m currently exploring the possibility of incorporating a 6-digit unique ID generation process into my web forms using custom JavaScript. My aim is to enhance data management and streamline form submissions on my website. I’m particularly interested in understanding the technical aspects involved in dynamically creating such IDs and how they can be seamlessly integrated into the form submission process.

Could anyone shed some light on the best practices and potential challenges associated with this approach? Any insights, tips, or examples from your experience would be greatly appreciated. Additionally, if you have any alternative methods or suggestions for achieving similar functionality, I’m open to exploring those as well.

Thank you in advance for your valuable contributions!

2 Likes

Hi Leo, and welcome to the Forum. Hang in there. This is a great question and I’m sure the Staff will be able to help you once they get from their weekend.

Hey there @Leo_Serres :wave:

Sure, our devs have come up with a custom code that should be added to the Custom JS field:

const FIELD_ID = '[total]';

const uniqueID = () => Math.random().toString(36).substring(2, 8);

widget.setFieldValue(FIELD_ID, uniqueID());

Do not forget to replace the FIELD_ID in the 3rd line of the code with the actual ID of your Hidden field:

image


Check it out and let me know how it worked :slightly_smiling_face:

Hi there,

i have make another hidden field


Otherwise I couldn’t get the ID in the email.
Field ID: [uniqueid] is empty in the email.
The Field ID [total] will be sent to the email.
I can’t explain why this is so
So far so good.

@Max If you use the generated ID to create a continuous sequence of numbers in which the current date may also be hidden, you could use it as a ticket ID.
That’s pretty well described here

This would also solve this proposal.
@user887 just lock.

https://community.elfsight.com/t/submission-id-on-forms/16192

Do you still have ideas about this?

regards Sina

2 Likes

Hi @Sina :wave:

Could you please send me a link to the page where your widget is installed? I’ll be happy to check why the Unique ID field didn’t work :slightly_smiling_face:

Hi @Max,

I’ve now found a solution because your instructions above didn’t work for me, it only worked with the ID [total]. But whatever. Now I have it.

function formatDateTime() {
    const now = new Date();
    
    const day = String(now.getDate()).padStart(2, '0');
    const month = String(now.getMonth() + 1).padStart(2, '0');
    const year = String(now.getFullYear()).slice(-2);
    const hours = String(now.getHours()).padStart(2, '0');
    const minutes = String(now.getMinutes()).padStart(2, '0');
    
    const lValue = `[${day}${month}${year}|${hours}${minutes}]`;
    //const aValue = `A-${day}${month}${year}|${hours}${minutes}`;
    //const tValue = `T-${day}${month}${year}|${hours}${minutes}`;
    return {lValue, aValue, tValue};
}

const {lValue, aValue, tValue} = formatDateTime();
widget.setFieldValue('[ticket-id]', lValue);
widget.setFieldValue('[current-date-a]', aValue);
widget.setFieldValue('[current-date-t]', tValue);

async function setClientIP() {
    try {
        // Collect the client's public IP address
        const response = await fetch('https://api.ipify.org?format=json');
        const data = await response.json();

        // Insert IP address into the variable
        const clientIP = data.ip;

        // Put the IP address in the widget field
        widget.setFieldValue('[client-ip]', `IP: ${clientIP}`);
    } catch (error) {
        console.error('Error getting IP address:', error);
    }
}

// Funktion aufrufen
setClientIP();

Additionally two hidden fields with the ID



Now I have createt a Ticket ID:
grafik

We had already discussed the issue of the IP address here with Helga
IP Address for Contact Form

1 Like