Custom Chatbot Build

Hey guys,

I’m facing an issue while building a chatbot where the input field is initially disabled to prevent users from accidentally submitting details when it’s hidden. Once the flow starts for a specific field type, the input field is set to display: show and its disabled property is removed.

The issue occurs when selecting Business Enquiry—after entering the requirements, the chatbot asks for the user’s name. However, the input field remains disabled, preventing any input. We’ve tried using the important attribute, but it still isn’t working.

Loom for explanation: Loom Message - 28 January 2025 | Loom

Read Only Link: Webflow - Hakuna Matata

Staging URL: Test

Your issue likely stems from the fact that disabling an input field (disabled attribute) makes it unresponsive to user interactions, and simply setting display: show or using !important in CSS won’t always re-enable it properly. Instead, ensure that your script explicitly removes the disabled attribute using JavaScript (input.removeAttribute("disabled")) when transitioning to the next question. Also, check if any other scripts or conditions are overriding this behavior. If the issue persists, inspect the console for errors or conflicts that may be preventing the attribute removal.

Hey CloudCoder, we tried the above syntax in the code but issue still remains the same. Can you tell us how we can find how it’s getting overriding the behavior?