• Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Web Application DIV Tag Usage

 
Steve Dyke
Ranch Hand
Posts: 1619
1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I am running ito a few problems using DIV tags as popups in my web app so I could use some advise on to best design practice.

1. Do I try and use generic popup holders or create a unique DIV tag holder for each different form, list, etc I want to display. Example I have about 20 different lists I display as popups in differnt areas of the app. Do I really need a separate div tag for each.

2. Do I set each popup with its own popups to avoid stack issues or have general popups rooted in the parent jsp.

3. Do I control the z-index at the page level(using CSS) or at the CSS level where I define the DIV tag?
 
David Newton
Author
Rancher
Posts: 12617
IntelliJ IDE Ruby
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
1) You'd need *some* way to identify them so you can control them, no?
2) I don't understand the question.
3) Depends on how your popups work. Personally, I'd use a library and not worry about it.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64721
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
"popup" is definitely not the right word.

1) I don't know what you mean by "generic holder", or even holder. A <div> is a way to create a block of elements to be dealt with as a unit, so I think the answer is "individual" even if I'm not quite sure what the question is.

2) Again, not clear what the question is, but I suspect the answer is to just keep track of the appropriate z-indexes.

3) Page level vs CSS level? Does not compute. What are you meaning?
 
Gregg Bolinger
GenRocket Founder
Ranch Hand
Posts: 15302
6
Chrome IntelliJ IDE Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'll add my own little bits here.

1) A lot of times I pull the DIV from the server on an ajax request that contains the information I need, and I turn that div into a "dialog" (I think is the appropriate term here). So I don't really need to keep track of anything. If things are static, that's a different story.

2) Dialogs on top of dialogs, ewe, messy. I'd avoid this as much as possible. The most I ever do is a dialog that might have a confirmation dialog display for a save/delete/whatever. More than that, again, ewe!

3) Yea, don't understand this.

I'd avoid a lot of this confusion by using something like jQuery UI's Dialog. Or something of equivalent.
 
David Newton
Author
Rancher
Posts: 12617
IntelliJ IDE Ruby
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
That went well.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64721
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
And.... if it's "dialogs" you are after, the jQuery UI Dialog widget is hard to beat.
 
Steve Dyke
Ranch Hand
Posts: 1619
1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I will try and explain a little better. I am not the best at explanations so please bear with me.

I have my main form with a header, left hand navigation and right hand content. These are DIV tags.

So I jquery.load the content by selecting a navigation option. This content is a page that is laid out with several DIV Tags( its own header, navigation, body, etc, and hidden DIV tags used to display blocks of spcific data or dynamic lists, this is what I was refering to as a holder(a DIV tag used to display a form in a specific location). It could be an input form that populates the content area or may be a table of editable records.

Lets choose the latter. On of the fields is a link that displays vendor data. I use a DIV tag to display this using jquery.load. I call this a popup. within this displayed form there is a text box that contains the vendor code. When I click this box I use DIV tag to display the list of approved vendors using jquery.load for the user to choose from
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic