使用表格数据填写表格 [英] Fill form using table data

问题描述

所以我有一个表单，通过它向数据库添加条目，我试图使用相同的表单
来更新/编辑数据库中的现有记录。

我的页面由添加数据的表单和显示现有数据的表格组成。
对于每个条目，现有数据表都有一个 edit 列，表格使用php动态填充。

这就是我我试图去，当用户点击任何行的编辑按钮时，该行中的数据应该自动填充到表单。

我做了一个jsfiddle < a href =http://jsfiddle.net/ZE6BX/6/ =nofollow> here

我试过的JS脚本：

$ b $

  $（＃tableID）。on（click，.edit_button，function（）{
）var data = $（this）.closest（td）。siblings（）。map（function（）{
 return $（this）.text（）; 
}）。toArray（） ; 
 
 console.log（data）; 
}）; //事件无法识别。无法点击。 
  

我在这里找到了很多技巧，但其中大部分都不响应click事件或他们返回null /空值，这是因为表单是动态填充的？

我对web开发很新，任何帮助将不胜感激。注意： 数据库包含20多条记录（动态添加），在Jsfiddle中我只显示了1，保持代码清洁。抱歉缺少css样式：P

解决方案

  $（ （）.edit_button，function（）{
 var data = $（this）.closest（td）。siblings（）。map（function（）{
返回$（this）.text（）; 
））。toArray（）; 
 
 console.log（data）; 
}）; 
  

像这样使用可能会有帮助

< pre $ $（＃tableID）。click（function（）{
var data = $（this）.closest（td）。siblings（）。map function（）{
return $（this）.text（）;
}）。toArray（）;

console.log（data）;
}） ;


So I have a form through which I add entries to my database, I am trying to use the same form to update/edit existing records in the database.

My page consists of a form to add data and a table which shows existing data. the existing data table has a column edit against each entry, the table is filled dynamically using php.

This is what I am trying to to, when the user clicks on edit button against any row, the data in that row should be filled up into the form automatically.

I made a jsfiddle here

The JS script I have tried:

$("#tableID").on("click", ".edit_button", function() {
    var data = $(this).closest("td").siblings().map(function() {
        return $(this).text();
    }).toArray();

    console.log(data);
}); // the event is not recognized. no action on clicking.

There a quite a few techniques I found here stackoverflow, but most of them donot respond to click event or they return null/empty values, Is that because the form is filled dynamically?

I am pretty new to web development, Any help would be appreciated. Thanks!

Note: the database contains more than 20+ records (dynamically added), In Jsfiddle I have shown only 1, to keep the code clean. sorry for the lack of css styling :P

解决方案

$("#tableID").on("click", ".edit_button", function() {
    var data = $(this).closest("td").siblings().map(function() {
        return $(this).text();
    }).toArray();

    console.log(data);
});

Use like this may be it is helpful

$("#tableID").click( function() {
    var data = $(this).closest("td").siblings().map(function() {
        return $(this).text();
    }).toArray();

    console.log(data);
});

这篇关于使用表格数据填写表格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！