Adding a button to a table cell?

Is there really no way to add a button to a table cell? Looks like one can be added through the DOM Panel but it doesn’t show up in the design view or the App Panel so you can’t do anything with it.

I was able to add buttons to a cell manually in code view and get them to work. However they do not display in the proper place in the App Structure.

Brad,

I agree with you, it is somewhat confusing that an element does not show up in the App Structure panel that I then have to duck over to the DOM panel. I think that the App panel should be able to accommodate all elements. Not sure how you managed to get the button to show in the App panel.

As for manipulating the button element and as you have noticed, clicking on the button in Design view will select the button and the Properties panel will allow changing properties and attributes.

Hi Ben, to get the button to show in the App structure I had to add it by hand in code view. It shows up, in the wrong place, but it shows up.

Perhaps the Wappler devs should consider a migration of the DOM structure into the App Structure. Needs lots of thinking and clever UI to keep it organized and user friendly. Right now already I like the visual tools with all the popup icons less and less.

2 Likes

Please download and install v 1.0.1 - the issues should be fixed. Now you can add a button in the DOM tree, change its class in the properties inpector and add text to it.

Ok, I can add the button fine.

  • Can’t Add Text To It
  • Can’t open a Modal with it
  • When selecting the button in the App Panel this is what I see …

Well, what about trying this in Dom tree panel?

Wasn’t working in the DOM tree panel so I thought I’d see what happens in the Design View.

So, I managed to add the button text. No way to bootstrap style it or open a modal with it. Frustrating.

You can add text and everything here

Brad, what is frustrating exactly? What and how are you trying to do? You can add whatever you like!

I’m trying to add a button that is bootstrap styled that I can toggle a modal with. Should be simple.

So what EXACTLY is wrong???

lol, there is no way to do it. That is EXACTLY what is wrong.

Where and what are you clicking? It is really hard to understand what are you trying to achieve without explaining what and where you are clicking step by step.

  • Select my table cell in DOM Tree
  • Insert Button
  • Add Text to Button

That’s it as far as I can go.

  • Can’t style the button with Bootstrap Styling
  • Can’t Toggle a modal

I should add that if you could toggle a modal from a text link I wouldn’t need to do all this.

I see no issues opening a modal from a link:

Thanks for that screenshot. However, that is not a practical solution as it uses up the onclick action. So now you can’t select on click to load the Data Detail Region.