I'm trying to make a registration system where the user will be given a set of events to participate in. Depending on the event that is selected, I want the rest of the form to be displayed. I don't have a clue as to how to start with this. Any advice please?
For example,
EVENTS are:
1
2
3
4
5
For 1, I don't need a field named "Abstract" but I need it for Event 5... I hope I could express myself clearly...
CSS Form Display
Moderator: General Moderators
- superdezign
- DevNet Master
- Posts: 4135
- Joined: Sat Jan 20, 2007 11:06 pm
Don't know if you've already gone ahead with the AJAX or whatnot, but the way I've done this is something like this
it works, don't know if its the optimum way to code anything, I'm sure you could handle the conditions with a switch or something, but this is the gist of it.
Code: Select all
<form action="" method="POST">
<?
if ($_POST['insert']=1)
{
fully process form, print confirmation
}
else
{
if($_POST['ev_id']!=NULL)
{ ?>
<insert type="hidden" name="insert" value="1">
<select name="ev_id">
<option value="<?=$_POST['ev_id'];?>">Event <?=$_POST['ev_id'];?></option>
</select>
<?
if ($_POST['ev_id']=1)
{
echo event id 1 form stuff
}
else if ($_POST['ev_id']=2)
{
echo event id 2 form stiff
}
}
else
{ ?>
<select name="ev_id" onchange='this.form.submit()'>
<option value="1">Event 1</option>
<option value="2">Event 2</option>
<option value="3">Event 3</option>
</select>
<?
}
}
?>it works, don't know if its the optimum way to code anything, I'm sure you could handle the conditions with a switch or something, but this is the gist of it.
Last edited by nykoelle on Fri Aug 17, 2007 7:57 am, edited 3 times in total.
Sure... Just tried it with a sample... I have two files.... One is a html file in which i write the ajax code and the other one is a simple php file having a series of if statements.
My html file is something like:
My php file would be something like:
And the <head> section of my html file contains:
Hope that helps... As you can see, for the sake of testing I've written some really crude code... I'll paste the real one after I'm done with it...
My html file is something like:
Code: Select all
<div id="main">
<p><input type="radio" name="sample" value="1">Sample1<br>
<input type="radio" name="sample" value="2">Sample2<br>
<input type="radio" name="sample" value="3" onClick="sendDetails('sample3');new Effect.toggle('formcontent');">Sample3<br>
</p>
<p><div id='formcontent' style="display:none;"></p>
Code: Select all
<?php
if($_GET['formoption'] == 'sample3') {
$formfield = "HTML Code for Form here";
echo $formfield;
}
else {
Other stuff here
}
?>Code: Select all
<script src="js/prototype.js" language="JavaScript" type="text/javascript"> </script>
<script src="js/scriptaculous.js" type="text/javascript"></script>
<script type="text/javascript" language="JavaScript">
function sendDetails(type){
var url = 'content.php';
var params = '?content=' + type;
var ajaxDisplay = document.getElementById('bodycontent');
ajaxDisplay.innerHTML = "<center><img src='loading.gif' /> <b>loading..</b></center>";
var ajax = new Ajax.Updater(
{success: 'bodycontent'},
url,
{method: 'get', parameters: params, onFailure: reportError});
}
function reportError(request) {
$F('bodycontent') = "Error";
}
function emailValidator(elem){
var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
if(elem.value.match(emailExp))
return true;
}
</script>