[tw5] How to Create a Popup Form

Google Group (Read Only)
#1

Hi all,

I would like to create a HTML Pop Up form similar to this, but I don’t know how to add a DIV layer or button that on top of all the layers on at the bottom of TW5.

Can anyone help me with this?

Thanks a lot.

#2

Hi James,

It seems you try to log-in to an online service. TW is a single page app. So it catches the input from popups and evaluates them locally. …

Login forms usually send info to a server. … So can you be more specific, what you try to achieve with the form?

-m

#3

Hi Mario,

Thanks for the reply.
I intent to add a “Live Chat” to my TW5. So that, I can hide when I don’t need it.

#4

I would like to create a HTML Pop Up form similar to this,

Hi James
I can answer this question, but without more specific information it will not really help you.

It will just show the HTML form with some CSS formatting and that’s it.

Styles in TW are defined using a tiddler named eg: my-form-styles tagged: $:/tag/Stylesheet

PopUps can be defined using the reveal-widget using the type: popup
or may be a modal in your case.

I did attach ZIP that I created while testing.

You can download, extract and drag & drop import it into a TW

The CSS needs to be changed a bit.

display: none; and postition: fixed; have been removed. They are “covered” by the tiddler frames.

Please head over to talk.tiddlywiki.com … There will be more people watching.

Usually we create our own forms using TW widgets like the edit-widget, button-widget and so on.

As I wrote without more specific info we can only guess, which results in some pretty pictures.

mario

(Attachment show-html-form.zip is missing)

#5

Sorry wrong link in the other post.

Here’s the real one

Please head over to talk.tiddlywiki.org … There will be more people watching.

1 Like
#7

James wrote:

I would like to create a HTML Pop Up form similar to this, but I don’t know how to
add a DIV layer or button that on top of all the layers on at the bottom of T.

First, the much more active community has moved to https://talk.tiddlywiki.org/. You will probably get a better response there.

Second, if you’re just looking for how to handle popups, this is an excellent reference:

https://clutterstack-tw-notes.tiddlyhost.com/#Popups%20reference%20sheet

Once you have that working, if you need help with the form, you might want to ask a separate question.