使用/ jQuery将更新的表单存储为数组

时间:2013-12-16 16:57:29

标签: javascript php jquery arrays input

我目前正在构建一个内部工具,用于通过Web查看和编辑类似SQL的表。我有一些PHP和html编写生成这些表和jQuery写的,到目前为止:

  • 删除行
  • 添加新行
  • 输入后的输出表单值

当然,最终目标是使用INSERT,UPDATE,DELETE等对修改后的数据生成SQL语句。我已经掌握了如何将结果连接到这样的语句,但可以使用帮助定位列。

我主要关心的是修改表单值输出功能,以便我可以将任何更新的条目存储在数组中并将它们输出为CSV字符串。我读过.each,.map,.push和.serializeArray。我不确定如何使用/组合这些方法来实现所需的结果。以下是一些代码段:

当前的jQuery:

$('#add_row').on('click', function(){
    $('<tr><td id="data"><input class ="new_row"></td><td id="data"><input class ="new_row"></td><td id="data" style="text-align:center;"><input class ="new_row"></td><td id = "Delete_Button"><button class="rmv_row">-</button></td></tr>').appendTo('#SQLdata');
});



$("table").on('keyup', 'input', function(){
    $('#output').text($(this).val());
    });

$('table').on('click', '.rmv_row', function(){
    $(this).closest('tr').remove();
});
});

和PHP / HTML:

<table id="SQLdata">
<tr style="background-color: margin-left:#6b685c;">
<td style="background-color: margin-left:#6b685c; font-family:tahoma,arial,verdana,sans-serif"; colspan="3">

<form style="color:black;" method="post" action="WebEventsStructureColumnTool.php">
        Select your table name:
    <select method="post" name="table_name" id="picker">
<option>Removed For Security</option>
</select>
    <input type="submit" value="Go" name="submit">
    </form>
</td>
<td><button id="add_row">Add a Row</button></td>
</tr>

$tableName = $_POST['table_name'];    

$statementObject = $pdo->prepare("SELECT a, b, c FROM tab WHERE _id =?");

$statementObject->bindParam(1, $tableName, PDO::PARAM_STR);

$statementObject->execute();

$statementObject->bindColumn('a', $Col1);
$statementObject->bindColumn('b', $Col2);
$statementObject->bindColumn('c', $Col3);

while ($statementObject->fetchAll(PDO::FETCH_BOUND)){

// Gets an array from the CSVs in the column :     
$Column1 = explode(",", $Col1);
$Column2 = explode(",", $Col2);
$Column3 = explode(",", $Col3);
}
//Fetches the total number of values from each exploded array:
$Count1 = count($Column1);
$Count2 = count($Column2);
$Count3 = count($Column3);
//Establishes the total length/height of the table:

$largest = $Count1;
if ($Count2 > $largest){
    $largest = $Count2;
}
if ($Count3 > $largest){
    $largest = $Count3;
}

echo '
<tr>
<th>a</th>
<th>b</th>
<th style="text-align: center">c</th>
<th>delete row</th>
</tr>';

for($i = 0; $i < $largest; $i++){
        $tableRows[] = 
        "<tr>
            <td id='data'>
                <input type='text' value='" . $Column1[$i] . "'>
            </td>" . 
            "<td id='data'>
                <input type='text' value='" . $Column2[$i] . "'>
            </td>" . 
            "<td id = 'data' style='text-align:center;'>
                <input type='text' value='". $Column3[$i]. "'>
            </td>
            <td id = 'Delete_Button'><button class='rmv_row'>-</button></td>";
}


foreach ($tableRows as $row){   
    echo $row;
}   

echo '</table><div><table><tr id="output" colspan="4"></tr></table>'

如果有人也对现有代码提出建议/建议,请随时批评。我刚开始时是一名年轻的开发人员,可以使用我能得到的所有帮助。谢谢!

今天早上我添加了这一位,现在我成功获得了CSV:

var string = new Array()
function updateString(){$('#output').text(string);}

$('input').each(function(){
    string.push($(this).val());
});

为每个数据操作选项创建三个不同的数组并限制打印到条件。

0 个答案:

没有答案