jQuery: form input values turns up undefined
- by Seerumi
Having problem with this bit of code qith jQuery. it should pick the values from current form and then submit them, but when I try to get them with jQuery they always turn up undefined.
I know the SQL results are fine since they show correctly in HTML table, so it must be my inferior javascript skills.
New with jQuery and I'm at loss :(
PHP/HTML:
echo "<table>\n"
while ($row = odbc_fetch_array($query))
{
echo "<form class='catForm'>\n";
echo "<input type=hidden class='catID' name='catID' value='".$row['running_id']."'/>\n";
echo "<tr>\n";
echo "<td>".$row['running_id']."</td>\n";
echo "<td>".$row['site_id']."</td>\n";
echo "<td>".$row['main_category']."</td>\n";
echo "<td>".$row['map_name']."</td>\n";
echo "<td><input type=textfield class='bCatID' value='".$row['mapping_id']."' size=6/></td>\n";
echo "<td><input type=submit class='saveCat' value='Save'/></td>\n";
echo "<td><input type=submit class='killCat' value='Delete' /></td>\n";
echo "</tr>\n";
echo "</form>\n";
}
echo "</table>";
jQuery:
$(".catForm").submit(function () {
var id = $(this).find('.catID').val();
var bCatID = $(this).find('.bCatID').val();
var dataString = 'id='+id+'&bCatID='+bCatID;
$.ajax({
type: "POST",
url: 'adminUI/bin/updateSCategories.php',
dataType : 'json',
data: dataString,
success: function(data)
{
if (data.error == true)
$('.failure').html("Error, save failed.").show().fadeOut(2000);
if (data.error == false)
$('.success').html("Saved succesfully").show().fadeOut(2000);
},
error: function(XMLHttpRequest, textStatus, errorThrown)
{
$('.failure').html("Error, save failed.").show().fadeOut(2000);
}
});
return false;
});
RESULT:
id: undefined
bCatID: undefined