New Custom AI Component

I am having trouble connecting my new AI custom component to my Actions (button). Any suggestions?

Can you elaborate on what type of component are you making and your current setup?

I wanted to create 3 buttons & have each do a different action but I am having trouble getting the action paired with the correct button.

I am in testing phase to see what I can do with the new custom AI component. Any help would be appreciated.

here is my info

(attachments)

ai.png
3 actions.png

i want to connect button1 with action 1 and so on

Here’s something you can use in a Code component.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0"
    />
    <title>AlpineJS Circle Buttons</title>
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/alpinejs/3.10.5/cdn.min.js"
      defer
    ></script>
    <style>
      .button-container {
          display: flex;
          justify-content: center;
          align-items: center;
          height: 60px;
          gap: 20px;
      }
      .circle-button {
          width: 50px;
          height: 50px;
          border-radius: 50%;
          border: none;
          background-color: #3498db;
          color: white;
          font-weight: bold;
          cursor: pointer;
          transition: background-color 0.3s;
      }
      .circle-button:hover {
          background-color: #2980b9;
      }
    </style>
  </head>
  <body>
      <div class="button-container">
        <button class="circle-button" @click="action1">
          1
        </button>
        <button class="circle-button" @click="action2">
          2
        </button>
        <button class="circle-button" @click="action3">
          3
        </button>
      </div>
    </div>
  </body>
</html>

3 Likes

thank you that worked but I have 2 questions

  1. how/where did you get the html code?
  2. can you do this with AI component?

Since the last update, using AI has become easier.


2 Likes

I usually just talk to Claude directly if I have an idea about the component to get a start, then dive in to adjust things myself when something is not working correctly.

I never used the AI component since I want to see and edit the code directly.

1 Like

thank you for your fast response.
when you use the AI component, have you noticed that after creating the clickable button if works fine but if you leave the page/tab and come back to it, the button does not work.

The possibility is mind blowing! but also challenging the way to build things in Glide.

Yes, while waiting for them to develop it to make it better.

Patiently waiting again this week as it’s broken again :sweat_smile:

1 Like