...

View Full Version : Form data not sent when field inside <div> or <span> tags?



cyphix
07-18-2007, 09:52 PM
Hey guys..... I'm having a weird problem here..... I have a form that is submitting via GET & all fields submit the data fine EXCEPT for fields enclosed inside <div></div> or <span></span> tags.... I found this rather strange - anyone know what the issue is here?

The fields need to be inside something that I can apply an "id" to.

Cheers!

Brandoe85
07-18-2007, 10:11 PM
What's the code? Are the tags between <form>?

cyphix
07-18-2007, 10:20 PM
Yes. the tags are between <form> tags..... here is the code in question..



<div id="model_list">
<select name="search_model" class="textfield1" disabled="disabled">
<option value="" selected>Seleccione o Modelo</option>
</select>
<input type="hidden" name="search_model_text" value="">
</div>


Don't pay any attention to the disabled field; that is changed with ajax when the user selects something in another field.

Anyway..... I put the hidden field inside the <div> tags for testing..... it submits fine if I place it outside of them, but not inside.

Fumigator
07-18-2007, 10:54 PM
Does the page's markup validate?

http://validator.w3.org/

_Aerospace_Eng_
07-19-2007, 12:26 AM
It would help if you posted the rest of your code. Your complete form.

cyphix
07-19-2007, 02:13 AM
Ok....I just took out the disabled tags.... I tried to submit something without touching any options & the items inside the <div> tags are now SENT.... however if I change any options (which sends the request to ajax) it will NOT send the data.

Not sure why.... the menus are constructed perfectly to the naked eye....

Here is more code...



<select name="make" class="textfield1" id="make" onChange="getModels();">
<option value="0" selected>Fabricante</option>
<option value="any">Qualquer</option>
<?php
// get the car makes
$result = mysql_query("SELECT * FROM setup_make") or die (mysql_error());
$total = @mysql_num_rows($result);

$i = 0;

while ($i < $total)
{
$make_id = mysql_result($result, $i, 'make_id');
$make_name = mysql_result($result, $i, 'make_name');
echo "<option value='?model=$make_id'>$make_name</option>";
$i++;
}
?>
</select></td>
<td colspan="2"><select name="search_cat" class="textfield1">
<option value="" selected>Categoria</option>
<option value="any">Qualquer</option>
<?php
// get the categorys
$result = mysql_query("SELECT * FROM setup_category") or die (mysql_error());
$total = @mysql_num_rows($result);

$i = 0;

while ($i < $total)
{
$cat_id = mysql_result($result, $i, 'category_id');
$cat_name = mysql_result($result, $i, 'category_name');
echo "<option value='$cat_id'>$cat_name</option>";
$i++;
}
?>
</select></td>
</tr>
<tr>
<td colspan="2">
<div id="model_list">
<select name="search_model" class="textfield1">
<option value="" selected>Seleccione o Modelo</option>
</select>
</div>

</td>


Here is the ajax code..



var xmlHttp

function getModels()
{
var foo;
foo = document.search.make.options[document.search.make.selectedIndex].value
if (foo==0)
{
document.getElementById("model_list").innerHTML="<select name='search_model' class='textfield1' disabled='disabled'><option value='' selected>Seleccione o Modelo</option></select>";
return;
}
else if (foo=="any")
{
document.getElementById("model_list").innerHTML="<select name='search_model' class='textfield1' disabled='disabled'><option value=''>Seleccione o Modelo</option><option value='any' selected>Qualquer</option></select>";
return;
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="get_models.php";
url=url+foo;
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("model_list").innerHTML=xmlHttp.responseText;
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}


Here is the code in the PHP file that ajax retrieves data from..




include_once("setting.php");

$db_connect = mysql_connect($db_host, $db_username, $db_password) or die(mysql_error());
mysql_select_db($db_name, $db_connect) or die(mysql_error());

// Get the model & check if it is set

if (isset($_GET['model'])) {

$listing_make = trim($_GET['model']);

if (!is_numeric($listing_make) or $listing_make == "") {
$buffer = "<select name='search_model' class='textfield1' disabled='disabled'><option value='' selected>Seleccione o Modelo</option></select>";
} else {

$result1 = mysql_query("SELECT DISTINCT listing_model FROM listing WHERE listing_make='$listing_make' ORDER BY listing_id DESC") or die (mysql_error());
$total1 = @mysql_num_rows($result1);

$i = 0;

if ($total1 < 1) {

$buffer = "<select name='search_model' class='textfield1'><option value=''>Seleccione o Modelo</option><option value='any' selected>Qualquer</option></select>";

} else {

$buffer .= "<select name='search_model' class='textfield1'>\n";
$buffer .= "<option value='' selected>Seleccione o Modelo</option>\n";
$buffer .= "<option value='any'>Qualquer</option>\n";

// get the categorys

while ($i < $total1) {
$list_model = @mysql_result($result1, $i, 'listing_model');
$buffer .= "<option value='$list_model'>$list_model</option>\n";
$i++;
}

$buffer .= "</select>\n";

}

}

} else {
$buffer = "<select name='search_model' class='textfield1' disabled='disabled'><option value='' selected>Seleccione o Modelo</option></select>";
}

mysql_close();

echo ($buffer);


Thanks a lot!

_Aerospace_Eng_
07-19-2007, 02:25 AM
I'm pretty sure innerHTML doesn't add to the DOM which is why they aren't submitting. You need to use DOM to create the select elements dynamically.

cyphix
07-19-2007, 02:33 AM
Ahhhh... gotcha!

Cheers! :thumbsup:

cyphix
07-19-2007, 03:09 PM
Hmmmmm...... I changed the javascript code to the below & it STILL doesn't submit the data from that field..... :(



var xmlHttp

function getModels()
{
var foo;
var newdiv = document.createElement("div");

foo = document.search.make.options[document.search.make.selectedIndex].value
if (foo==0)
{
document.getElementById("model_list").innerHTML="";
newdiv.innerHTML="<select name='search_model' class='textfield1' disabled='disabled'><option value='' selected>Seleccione o Modelo</option></select><input type='hidden' name='search_model_text' value=''>";
var model_list = document.getElementById("model_list");
model_list.appendChild(newdiv);
return;
}
else if (foo=="any")
{
document.getElementById("model_list").innerHTML="";
newdiv.innerHTML="<select name='search_model' class='textfield1' disabled='disabled'><option value=''>Seleccione o Modelo</option><option value='any' selected>Qualquer</option></select><input type='hidden' name='search_model_text' value='any'>";
var model_list = document.getElementById("model_list");
model_list.appendChild(newdiv);
return;
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="get_models.php";
url=url+foo;
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4)
{
var newdiv = document.createElement("div");
document.getElementById("model_list").innerHTML="";
newdiv.innerHTML=xmlHttp.responseText;
var model_list = document.getElementById("model_list");
model_list.appendChild(newdiv);
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}


Cheers!

_Aerospace_Eng_
07-19-2007, 09:44 PM
As I said before you can't use innerHTML on form elements if you expect them to work. You have to create everything using DOM. Using innerHTML and then trying to attach it using dom does not work.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum