Saving form data from a select box

[SuperSal]

Hi everyone, for some reason the form data from the select boxes are not saving. The code is a bit strange (I apologise) but its just javascript creating the form elements dynamically. here's the code(cut down):

function menu_list ()
{
this.JPEGHighRes = new create_menu("JPEGHighRes"); //video
this.JPEGHighRes.description = "JPEG High";
this.JPEGHighRes.var_type = "Select";
this.JPEGHighRes.size = 40;
this.JPEGHighRes.value = 1;
this.JPEGHighRes.list_desc=new Array("1600x1200", "800x600", "640x480");
this.JPEGHighRes.onchange = "save";
}

function render_multi_menu(menu_desc)
{
var dstr="";

for (var iter in menu_desc)
{
if (menu_desc[iter].var_type == "Alpha")
dstr += render_alpha(menu_desc[iter]);
if (menu_desc[iter].var_type == "Checkbox")
dstr += render_checkbox(menu_desc[iter]);
if (menu_desc[iter].var_type == "Numeric")
dstr += render_numeric(menu_desc[iter]);
if (menu_desc[iter].var_type == "Select")
dstr += render_select(menu_desc[iter]);
if (menu_desc[iter].var_type == "Radio")
dstr += render_radiobutton(menu_desc[iter]);
}
return dstr;
}

function render_select(menu_desc)
{
var dstr="";

dstr += '<tr><td>' + menu_desc.description +'</td><td></td>\n';
dstr += '<td align=center><SELECT name="name_'+ menu_desc.sys_var +'" onchange=' + menu_desc.onchange +' type="select">\n';
for (var iter in menu_desc.list_desc)
{
dstr += '<OPTION VALUE='+iter;
if (menu_desc.value == iter)
{
dstr += ' selected="selected" ';
}
dstr += '>'+menu_desc.list_desc[iter]+'</OPTION>\n';
}
dstr += '</SELECT></td><td></td></tr>\n';

return dstr;
}

function get_formdata(form_data)
{
var theForm = document.forms[0];
var textData = ""
var URL = location.href;

for(i=0; i<theForm.elements.length; i++)
{

if (theForm.elements.value != "") //Not sure whether we need this....do we need to save empty form elements or not?
{
if(theForm.elements.type == "text" || theForm.elements.type == "textarea" || theForm.elements.type == "button" && theForm.elements.onchange == "save")
{
textData += theForm.elements.name + "=" + theForm.elements.value +'&'
}
else if(theForm.elements.type == "checkbox" && theForm.elements.onchange == "save")
{
textData += theForm.elements.name + "=" + theForm.elements.checked +'&'
}
else if(theForm.elements.type == "select" && theForm.elements.onchange == "save")
{
textData += theForm.elements.name + "=" + theForm.elements.options[theForm.elements.selectedIndex].text +'&'
}
}
}
var URL1 = URL+='?'+textData;
var CGIURL = URL1.replace(/\s/g,'+');
var CGIURL1 = CGIURL.slice(0, -1)

alert(CGIURL1);
}

function render_table(title)
{
var dstr="";
var i;

dstr += '<form action="" name="form1">\n';
dstr += '<table>\n';
dstr += '<tr><td></td><td><FONT SIZE=+1 FACE="Arial"><b>' + title + '</b></font></td></tr>\n';
dstr += render_multi_menu(general);
dstr += '<tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr>\n';
dstr += '</table>\n';
dstr += '</form>\n';
return (dstr);
}

var general = new menu_list();

document.write(render_table("Test Table"));

if anyone can see why the select box selection isnt being saved then that would be great.

Cheers
Sally

 

[BillyRayPreachersSon]

When you say "not being saved", do you mean that when your form is posted sent server-side, the element data is not available?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[SuperSal]

Sorry Dan, I should have been clearer. Basically I am creating a URL so that I can send the form data which needs saving to the server. In the get_formdata function I am looping through the elements which have the onchange set to save. From checking the html created when i run the code, the onchange is being set to save but for the select boxes this is not being passed to the CGIURL1 variable and output in the alert box. It is passing the correct data for the text elements so I'm not sure why it isn't for the select boxes.

function get_formdata(form_data)
{
var theForm = document.forms[0];
var textData = ""
var URL = location.href;

for(i=0; i<theForm.elements.length; i++)
{

if (theForm.elements.value != "") //Not sure whether we need this....do we need to save empty form elements or not?
{
if(theForm.elements.type == "text" || theForm.elements.type == "textarea" || theForm.elements.type == "button" && theForm.elements.onchange == "save")
{
textData += theForm.elements.name + "=" + theForm.elements.value +'&'
}
else if(theForm.elements.type == "checkbox" && theForm.elements.onchange == "save")
{
textData += theForm.elements.name + "=" + theForm.elements.checked +'&'
}
else if(theForm.elements.type == "select" && theForm.elements.onchange == "save")
{
textData += theForm.elements.name + "=" + theForm.elements.options[theForm.elements.selectedIndex].text +'&'
}
}
}
var URL1 = URL+='?'+textData;
var CGIURL = URL1.replace(/\s/g,'+');
var CGIURL1 = CGIURL.slice(0, -1)

alert(CGIURL1);
}

thanks
Sally

 

[BillyRayPreachersSon]

I suspect it's your test for "onchange". Specifying simply "save" as the attribute won't work, AFAIK. Try alerting the "onchange" value and see what you get back.

Also make sure your "onchange" event fires as you expect - I'm guessimg that it wont.

Hope this helps,
Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[tsuji]

to:Op
At some appropriate places, alert your .type and .onchange, you will learn something. It won't ever be "select" if it is an select input element or "save" if save is a function name.

 

[SuperSal]

Its really strange because its working for all the object elements apart from the select boxes. The other values are all gathered when the onchange is set to save apart from for the select boxes. The only difference in the code is when the select box is being created here:

function render_select(menu_desc)
{
var dstr="";

dstr += '<tr><td>' + menu_desc.description +'</td><td></td>\n';
dstr += '<td align=center><SELECT name="name_'+ menu_desc.sys_var +'" onchange=' + menu_desc.onchange +' type="select">\n';
for (var iter in menu_desc.list_desc)
{
dstr += '<OPTION VALUE='+iter;
if (menu_desc.value == iter)
{
dstr += ' selected="selected" ';
}
dstr += '>'+menu_desc.list_desc[iter]+'</OPTION>\n';
}
dstr += '</SELECT></td><td></td></tr>\n';

return dstr;
}

I know that select box values can be saved I just cannot work out why it is saving the data for the other elements when the onchange is set to true but not for the select boxes?

Thanks
Sally

 

[BillyRayPreachersSon]

We've already told you - test your "type" and "onchange" properties - they're probably not what you expect them to be.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]