Win a copy of Functional Reactive Programming this week in the Other Languages forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Div overlapping

 
Ashutosh Arya
Ranch Hand
Posts: 69
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi,

I am using AJAX in my application at various places and using div's to show the response.

Now a days I have seen at many places that the AJAX responses overlap other elements of the JSP

Eg: If I am making a table and i need to show it other elements.

Don't know how to do it? (Have tried with z index but it dint worked out!)

My code is like this:

<input type="text" name="Division1" id="divisionVal" onkeyup="autoComplete(this.value,event);"/> <div id="txtSuggestions"></div>

Th response is sitting in <div id="txtSuggestions"></div>

Please suggest how can I make it overlap other elements?

Thanks in advance!

Aashu
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65220
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Please take the time to choose the correct forum for your posts. This forum is for questions on JSP. For more information, please read this.

This post has been moved to a more appropriate forum.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65220
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
This has noting to do with Ajax. You can layer a <div> element over the others with a combination of z-index and CSS positioning.
 
Ashutosh Arya
Ranch Hand
Posts: 69
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi Bear,

I tried that but it was not working.

Can you please suggest an online resource where I can learn more about that?

Thanks

Aashu
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65220
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
ItDoesntWorkIsUseless

What did you try and how did it not work?
 
Ashutosh Arya
Ranch Hand
Posts: 69
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I tried:

<div id="txtSuggestions" style="z-index: 100"></div>

and gave z-index lesser than 100 to all other elements!

Is there anything wrong I am doing...yes surely something is wrong but what I am unable to find out!

Aashu
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Are you positioning it? Does not look like you are. Look at CSS Position
 
Ashutosh Arya
Ranch Hand
Posts: 69
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks to you all!

Got the result by using the below CSS:

.overlap {
position: absolute;
z-index:1002;
overflow: auto;
}

Aashu
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic