Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Javascript Rollup

Posted on 2005-05-12
6
Medium Priority
?
1,442 Views
Last Modified: 2012-12-02
Hi,
I cannot seem to find anything about what I believe are called Javascript Rollup's, meaning a mechanism that usually is initiated with at + or - and opens part of a screen (web page) and/or closes it. Normally used as a mechanism to allow the page user to organise the content on the screen better such that they only see the parts they need.

So for instance I may have a web page divided into say 5 distinct parts and want to allow the user to open and or close each of those five parts individually, similar to how a folder view in explorer would work on a desktop file system.
0
Comment
Question by:markloessi
  • 3
  • 3
6 Comments
 
LVL 1

Expert Comment

by:dominik_znidar
ID: 13994254
<script type="text/javascript">
function posk(el_id) {
   elem = (ducument.all) ? document.all[el_id] : document.getElementById(el_id);
   elem.style.display = (elem.style.display=="none") ? "block" : "none";
}
</script>

<div id="b1">
   <a href="#" onClick="posk("b1_cont");" id="b1_a">container1</a>
   <div id="b1_cont" style="display: none;">stuff displayed</div>
</div>
0
 
LVL 1

Accepted Solution

by:
dominik_znidar earned 2000 total points
ID: 13994257
So sory! Error occured!!

<script type="text/javascript">
function posk(el_id) {
   elem = (document.all) ? document.all[el_id] : document.getElementById(el_id);
   elem.style.display = (elem.style.display=="none") ? "block" : "none";
}
</script>
<div id="b1">
   <a href="#" onClick="posk('b1_cont');">container1</a>
   <div id="b1_cont" style="display: none;">stuff displayed</div>
</div>

This should work fine!
0
 

Author Comment

by:markloessi
ID: 13999384
Very Nice, I've implemented this and I'm having an issue, implemented here:
http://support.faulknertechnologies.com/rollups 
when you click on the open and close you get the content and then the screen refreshes to the root of the portal, how do you stop this. I was not sure if I need to do something with the # specification in the href

Thanks for your help!
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Author Comment

by:markloessi
ID: 13999401
Secondary question:
Could the <a href ....... > be replaced with some kind of input instead, like a button ?
That would be handy as well
0
 
LVL 1

Expert Comment

by:dominik_znidar
ID: 14000063
OK. It's cousing problems :);

To avoid executing links, change the href value from "#" to "javascript:void(0);". This thingy only executes event listeners such as onClick, etc.

Ofcourse you can make this action with almost any html objects like images, buttons, inputs, divs,...
Just include onClick="posk('b1_cont');" in its tag and test it :).

And remeber, if this object is form element such as input or button, remember to add RETURN FALSE to prevent form from submiting:
<button onClick="posk('b1_cont'); return false;">HIDE / CLOSE</button>

Nice page you have there :)
0
 

Author Comment

by:markloessi
ID: 14000442
Schweet! Excellento!

Thanks for the quick turnaround!
0

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

580 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question