使用ajax创建的字段将更改保存在表中

我正在设置一个ajaxy表单，在该表单中，管理员应该能够单击添加按钮（+）将新条目添加到mysql表中，并使该输入可编辑。添加按钮用于添加新行，但新行已"失效"。向输入文件中添加数据不会调用ajax php文件来保存数据，该文件包含删除（-）行的函数。

表单中的HTML和动态添加的div:

<div class="form-group" >
  <label class="col-xs-2 control-label">Friend's name</label>
  <div class="col-xs-2"><input type="text" class="form-control saveFname" name="fname" id="34"  gid="99" value="" placeholder="First name" /></div>
  <div class="col-xs-2"><input type="text" class="form-control saveLname" name="lname" id="34" gid="99"  value="" placeholder="Last name" /></div>
  <div class="col-xs-1"><button type="button" class="btn btn-default removeButton" id="34" gid="99" ><i class="fa fa-minus"></i></button></div>
</div>

添加字段组的javascript：

// ADD GROUP BUTTON
.on('click', '.addButton', function() {
  var ID=$(this).attr('id');
  var GID=$(this).attr('gid');
  var LAST=$(this).attr('last');
  $("#showGroup").html( "" );
  var dataString = 'name=add' +'&id='+ID +'&gid='+GID +'&last='+LAST;
  $.ajax({
    type: "POST",
    url: "addGroup2.php",
    data: dataString,
    cache: false,
    success: function(html)
    {
      $("#showGroup").html( html );
    }
  })
})
// END ADD GROUP BUTTON

javascript保存字段组数据：

// SAVE FNAME
$('.saveFname').keyup(function()
{
  var check=$(this).val();
  var avail=remove_whitespaces(check);
  var ID=$(this).attr('id');
  var GID=$(this).attr('gid');
  $("#Results").html( "" );
  if(avail!=''){
    $('.check_saveFname').show();
    var String = 'fname='+ avail;
    var dataString = 'fname='+ avail +'&id='+ID;
    $.ajax({
      type: "POST",
      url: "saveGroup2.php",
      data: dataString,
      cache: false,
      success: function(html)
      {
        $("#Results").html( html );
      }
    });
  }else{
    $('.check_saveFname').html('');
  }
});
// END SAVE FNAME

如何使动态添加的输入对请求做出响应？