I am hoping someone here can help me.
I have been working on this for the greater part of two days, and I am at a loss of what could be causing this issue.
I have a form which contains static fields and js generated drop-downs based on the category. When a user selected an item in the first drop down, a second is created through a JS function. I have the form validation working correctly thanks to a post comment by GreyHead on adding validation to fields added after page load, but when I press submit, the form tries to submit and is redirected to a 404 - Component can not be found. I am using the SEF plugin released with joomla 1.5, but no other sef components. I have tried turning this off, and also tried uploading a fresh set of component files to see if the culprit was a corrupt file, but no improvement.
I have noticed that the form works correctly when I remove the function to generate the second drop down. This is only a proof of concept to show, but eventually will be database driven; at that point, I will convert to AJAX. Here is the JS code I am working with (sorry for any messy code, as this is still in the works)
Here is the url to the form so you can see what is happening.
http://mfte.org/index.php?option=com_chronocontact&chronoformname=nickRequestForm
Thank you in advanced for any help or suggestions on a better approach.
Nick
I have been working on this for the greater part of two days, and I am at a loss of what could be causing this issue.
I have a form which contains static fields and js generated drop-downs based on the category. When a user selected an item in the first drop down, a second is created through a JS function. I have the form validation working correctly thanks to a post comment by GreyHead on adding validation to fields added after page load, but when I press submit, the form tries to submit and is redirected to a 404 - Component can not be found. I am using the SEF plugin released with joomla 1.5, but no other sef components. I have tried turning this off, and also tried uploading a fresh set of component files to see if the culprit was a corrupt file, but no improvement.
I have noticed that the form works correctly when I remove the function to generate the second drop down. This is only a proof of concept to show, but eventually will be database driven; at that point, I will convert to AJAX. Here is the JS code I am working with (sorry for any messy code, as this is still in the works)
//Abstract selection object
function selectionObject()
{
this.title = "Must be renamed";
this.emails = "***";
this.content = "This is the default Content, must be replaced";
}
var option1 = new selectionObject();
option1.content = "<select name=\"option\" id=\"option\" class=\"\" >"+
"<option value=''>Select a Class</option>"+
"<option value='General Knowledge'>Fire Fighter I & II: General Knowledge</option>"+
"<option value='Response'>Fire Fighter I & II: Response</option>"+
"<option value='Fundamentals of Fire Fighting'>Fire Fighter I & II: Fundamentals of Fire Fighting</option>"+
"<option value='Initial Attack Skills'>Fire Fighter I & II: Initial Attack Skills</option>"+
"<option value='Tactical Support Skills'>Fire Fighter I & II: Tactical Support Skills</option>"+
"<option value='Water Supply & Hose'>Fire Fighter I & II: Water Supply & Hose</option>"+
"<option value='Suppression'>Fire Fighter I & II: Suppression</option>"+
"<option value='Fight Fire Smart'>Fire Fighter I & II: Fight Fire Smart</option>"+
"<option value='EMS - Vehicle Rescue'>Fire Fighter I & II: EMS - Vehicle Rescue</option>"+
"<option value='Introduction to Haz Mat'>Fire Fighter I & II: Introduction to Haz Mat</option>"+
"<option value='Response to Haz Mat'>Fire Fighter I & II: Response to Haz Mat</option>"+
"<option value='Haz Mat Decon'>Fire Fighter I & II: Haz Mat Decon</option>"+
"<option value='Basic Fire School'>Basic Fire School (BFS)</option>"+
"<option value='Basic Fire Pump Operation'>Basic Fire Pump Operation (Pumps I)</option>"+
"<option value='Emergency Vehicle Operators Course'>Emergency Vehicle Operators Course (EVOC)</option>"+
"<option value='Fire Instructor I & II'>Fire Instructor I & II</option>"+
"<option value='Haz Mat Awareness & Operations'>Haz Mat Awareness & Operations</option>"+
"</select>";
option1.title = "Request to schedule Training Course Delivery";
//option1.emails += "***";
var option2 = new selectionObject();
option2.content = "<select name=\"option\" class=\"\" id=\"option\">"+
"<option value=''>Select a Trailer</option>"+
"<option>Air Trailer</option>"+
"<option>EVOC Trailer</option>"+
"<option>Haz Mat Ops</option>"+
"<option>Friction Force Door Trailer</option>"+
" </select>";
option2.title = "Training Trailers, Equipment, and Training Props";
//option2.emails += "***";
var option3 = new selectionObject();
option3.content = "<select name=\"option\" id=\"option\" class=\"\" >"+
"<option value=''>Select a Trailer</option>"+
"<option>Mobile Alarm Sprinkler Trailer (MAST)</option>"+
"<option>Driving Emergency Vehicle Simulator(DEVS)</option>"+
" </select>";
option3.title = "Specialty Mobile Trailers";
//option3.emails += "***";
var option4 = new selectionObject();
option4.content = "<select name=\"option\" id=\"option\" class=\"\" >"+
"<option value=''>Select a County</option>"+
"<option>Androscoggin</option>"+
"<option>Aroostook</option>"+
"<option>Cumberland</option>"+
"<option>Franklin</option>"+
"<option>Hancock</option>"+
"<option>Kennebec</option>"+
"<option>Knox</option>"+
"<option>Lincoln</option>"+
"<option>Penobscot</option>"+
"<option>Piscataquis</option>"+
"<option>Oxford</option>"+
"<option>Sagadahoc</option>"+
"<option>Somerset</option>"+
"<option>Waldo</option>"+
"<option>Washington</option>"+
"<option>York</option>"+
"</select>";
option4.title = "Request for Visit or Contact from a Training Program Manager";
//option4.emails += "***";
var option5 = new selectionObject();
option5.content = "<a href='http://www.mfte.org/index.php?option=com_content&view=article&id=15&Itemid=22'>MFTE Courses</a><br /><br />"+
"<label>Please describe the information you are requesting:</label><textarea name='comments' rows='5' cols='70'></textarea>";
option5.title = "Information on MFT&E Programs";
//option5.emails += "***";
var option6 = new selectionObject();
option6.content = "<select name=\"option\" id=\"option\" class=\"\" >"+
"<option value=''>Select a Certificate</option>"+
"<option>Request copy of Fire Fighter I</option>"+
"<option>Request copy of Fire Fighter II</option>"+
"<option>Request copy of Fire Instructor I</option>"+
"<option>Request copy of Fire Instructor II</option>"+
"<option>Request copy of Fire Officer I</option>"+
"<option>Request copy of Fire Officer II</option>"+
"<option>Reciprocity</option>"+
"<option>Rockers & Patches</option>"+
"</select>";
option6.title = "Certification Testing";
//option6.emails += "***";
var option7 = new selectionObject();
option7.content = "<label>Please describe the information you are requesting:</label><textarea name='comments' rows='5' cols='70'></textarea>";
option7.title = "General Inquiries";
//option7.emails += "***";
var option8 = new selectionObject();
option8.content = "<a href='http://www.mfte.org'>Visit Frequently Asked Questions</a>";
option8.title = "FAQ's";
var _divID;
function updateDiv(value, divID)
{
_divID = divID;
var option = parseInt(value);
switch(option)
{
case 1:
setContent(option1);
break;
case 2:
setContent(option2);
break;
case 3:
setContent(option3);
break;
case 4:
setContent(option4);
break;
case 5:
setContent(option5);
break;
case 6:
setContent(option6);
break;
case 7:
setContent(option7);
break;
case 8:
setContent(option8);
break;
default:
removeContent();
break;
}
}
function setContent(contentObj)
{
document.getElementById('optionFields').style.display = "block";
document.getElementById(_divID).innerHTML = contentObj.content;
document.getElementById('optionTitle').innerHTML = contentObj.title;
document.getElementById('emails').value = contentObj.emails;
var option_val = new LiveValidation('option', {validMessage: ''});
option_val.add(Validate.Selection,{failureMessage: 'Failed! Need to make a selection.'});
}
function removeContent()
{
document.getElementById('optionFields').style.display = "none";
document.getElementById(_divID).innerHTML = "";
}
Here is the url to the form so you can see what is happening.
http://mfte.org/index.php?option=com_chronocontact&chronoformname=nickRequestForm
Thank you in advanced for any help or suggestions on a better approach.
Nick