Guest Brivtech Posted September 16, 2007 Share Posted September 16, 2007 I've seen some websites that have forms, where as soon as you click on a radio button, or a drop-down option, a new form automatically apears underneath. How do they do that? Where do I begin on my journey to rediscovery? I'm sure I could do this a few years back, I think I must have been unwittingly abducted by aliens who stole the knowledge from my brain! Here's an example: Are you _ MALE / _ FEMALE? (Press MALE) What's your favourite Sci Fi? _________ (Press FEMALE) What's your favourite Romantic Drama? ____________ Of course, I want this to happen without the page reloading. <Yah, I know, stereotypical nonsense, but you try think something up on the spot!> Quote Link to comment Share on other sites More sharing options...
burgensteen Posted September 16, 2007 Share Posted September 16, 2007 Pm sent Quote Link to comment Share on other sites More sharing options...
Guest Brivtech Posted September 16, 2007 Share Posted September 16, 2007 And a great help it is to! Many thanks, it's refreshed my memory a touch, and I think I should be able to figure the rest out from that. :cry: Quote Link to comment Share on other sites More sharing options...
vokf Posted September 16, 2007 Share Posted September 16, 2007 And a great help it is to! Many thanks, it's refreshed my memory a touch, and I think I should be able to figure the rest out from that. Can you please share? I'm guessing its just hidden divs, with Javascript to enable... You've asked in this forum, its polite to share the information so others will find it. Jason Quote Link to comment Share on other sites More sharing options...
Guest Brivtech Posted September 16, 2007 Share Posted September 16, 2007 To be honest, the code I got won't help most people with this, it's something that's for a different application, but there are elements within that are a great help, the secret ingredient was in "onChange": http://www.w3schools.com/jsref/jsref_onchange.asp Where I was going wrong in trying to find answers was in the terminology I was using. Hidden DIVs? haven't come across anything like that for this yet. I have a load of figuring out to do now, how I can match this up with the application I need it for, and what coding I need to do to get there. Sorry, but there isn't much else for me to share at this stage until I have more answers - Very early days on this I fear. EDIT: Do a Google search for : "The script adds and removes form fields based on user actions. Try the form below." and all the answers of manipulating forms will be revealed! If anyone has come across something better, let us know! Quote Link to comment Share on other sites More sharing options...
vokf Posted September 17, 2007 Share Posted September 17, 2007 Hi Brivtech, I'm sorry if my post came out a bit short - I'd had a row with my ex-wife. Grr! Just to add to what you've posted, its possible to hide html code within a div Put your HTML code in a <div> and set: display: none; Using some javascript, its possible to show the hidden <div> Each div will require its own id, so: div#id1Form { margin: 0px 20px 0px 20px; display: none; } <div id="commentForm"> Extra elements go here </div> <a href="java script:toggleLayer('id1Form');" title="Add more info"> Add more info. </a> And the javascript to show the layer: function toggleLayer( whichLayer ) { var elem, vis; if( document.getElementById ) // this is the way the standards work elem = document.getElementById( whichLayer ); else if( document.all ) // this is the way old msie versions work elem = document.all[whichLayer]; else if( document.layers ) // this is the way nn4 works elem = document.layers[whichLayer]; vis = elem.style; // if the style.display value is blank we try to figure it out here if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined) vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none'; vis.display = (vis.display==''||vis.display=='block')?'none':'block'; } This isn't my work - it was taken from a google search for css hide div Not sure if this is helpful, I can't see why you can't put form elements inside the hidden divs. Jason Quote Link to comment Share on other sites More sharing options...
Guest Brivtech Posted September 17, 2007 Share Posted September 17, 2007 No probs Jason, we all get bad days. My subsequent reading assigned the "hidden" blocks to TR, but I've been playing with it, and you can indeed use DIVs instead. There's also no need to hide them, as the DIV can be empty to start with. Isn't this cool! X : I am Hungry What do you want to eat? _ - Food _ - I will starve _ - A baby! Cripes! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.