How to add custom field for POST on chat widget assistant?
I'm trying to add a custom input inside the form when that chat widget is rendered. It doesn't show on my logs. This is the remix link https://buildship.app/remix/2618166a-add2-4e3b-9d8b-c3b1cae9490c
Here's my script:
function addCustomField() {
const inputElement = document.getElementById("buildship-chat-widget__input");
if (inputElement) {
// Check if the hidden input already exists by name or id
if (!document.querySelector('input[name="user_role"]')) {
// Create hidden input element
const hiddenInput = document.createElement("input");
hiddenInput.type = "hidden";
hiddenInput.name = "user_role"; // Add name attribute
hiddenInput.value = "default_role"; // You can customize this value as needed
// Insert the hidden input after the input element inputElement.parentNode.insertBefore(hiddenInput, inputElement.nextSibling); console.log("Hidden input 'user_role' added."); } else { console.log("Hidden input 'user_role' already exists."); } } else { console.error("Chat input field not found."); } } Thank you in advance!
// Insert the hidden input after the input element inputElement.parentNode.insertBefore(hiddenInput, inputElement.nextSibling); console.log("Hidden input 'user_role' added."); } else { console.log("Hidden input 'user_role' already exists."); } } else { console.error("Chat input field not found."); } } Thank you in advance!
BuildShip - Visual backend workflow builder
Visually build workflows and powerful backend logic for your apps. Powered by AI, connect to anything with or without code.
2 Replies
AI Support Bot Information
<@700710888499314720> you can react on the relevant answer (message) with a ✅ in this thread when you think it has been solved, by the bot or by a human!
Anyone can react on this message with a ❌ if the GPT bot is unhelpful or hallucinating answers.
Please note: Team members will review and answer the questions on best efforts basis.
AI Response
To debug why your custom input field is not showing up in the logs, you might need to check a couple of points in your script. Here are some things to verify and a few modifications to try:
1. Ensure Correct Input Element ID: Verify that the ID
buildship-chat-widget__input
exists in your rendered HTML. The correct identification of the input element is crucial.
2. Check for Errors in Console: Monitor the browser console for any JavaScript errors when the widget is rendered and when the function is triggered.
3. Time of Function Call: Ensure that addCustomField()
is called after the DOM is completely loaded. You might use window.onload
or place the script at the bottom of the HTML file.
4. Debugging Steps:
- Add console.log
statements to check step-by-step flow.
- Verify that the input field is rendered before adding the hidden input.
5. Visibility in Logs: Check if the logs capture DOM changes dynamically.
Here's an updated version of your script with additional debugging steps:
This updated script includes additional logging to help trace through the flow and identify what might be going wrong. Make sure that window.addEventListener("load", addCustomField);
is correctly waiting for the DOM to be ready before attempting to add the custom field.
For more details and specific examples regarding the integration with custom fields inside chat widgets on BuildShip, refer to their integration examples.
If you still face issues, it might be helpful to check the BuildShip documentation or community forums for detailed troubleshooting specific to their platform .
BuildShip AI Support