jQuery:表单输入值未定义

时间:2010-06-09 08:52:33

标签: jquery forms submit undefined

对jQuery的这段代码有疑问。它应该从当前表单中选择值然后提交它们,但是当我尝试用jQuery获取它们时,它们总是未定义。 我知道SQL结果很好,因为它们在HTML表格中正确显示,所以它必须是我的低级javascript技能。 jQuery的新功能让我感到茫然:(

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;
});

结果:
id:undefined
bCatID:undefined

2 个答案:

答案 0 :(得分:1)

尝试一下:

$(".catForm").submit(function () { 
 $.ajax({
   type: "POST",
   url: 'adminUI/bin/updateSCategories.php',
   dataType : 'json',
   data: $(this).serialize(),
   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;
});

参考文献:.serialize()

答案 1 :(得分:0)

Jquery不能很好地处理表格中的表单:你应该重构你的html / js。