采用Perl CGI如何存储/发送由用户在动态表中输入数据 [英] perl cgi how to store/send data entered by user in dynamic table
问题描述
在从这个论坛阅读线程数，我能在其中创建一个CGI页面，动态表。现在我需要捕捉表中输入的信息，并将其存储在后端（我打算存入数据库）。
是否有人可以告诉我怎么做。我听说，它可以使用jQuery和AJAX来完成。但我是新来的网络技术，卡住不知道如何处理它们。
注意：正如我刚才所说的一个动态表。用户添加/删除行多达他想。我需要捕获所有这些数据。
这是我试过到目前为止
的Perl CGI脚本
＃！C：\ Program Files文件\ Perl的\ BIN \ perl的
使用严格的;
使用警告;
使用CGI QW {：标准};
使用CGI ::鲤鱼QW {fatalsToBrowser};
print_page_header（）;
print_html_head_section（）;
#################
##子程序##
#################
子print_page_header {
打印内容类型：text / html的\ñ\ N的;
}
子print_html_head_section {
打印＆LT; HEAD＆GT; \ N的;
打印＆LT;冠军＆GT;样品测试页＆LT; /标题＆GT; \ N的;
打印＆LT;脚本的src =HTTP：//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js类型=文/ JavaScript的'＆GT;＆LT; / SCRIPT＆GT; \ñ ;
打印＆LT;脚本的src ='.. / JS / mastertable_rowcontrol.js类型=文/ JavaScript的'＆GT;＆LT; / SCRIPT＆GT; \ N的;
#PRINT QQ {
＃＆LT;脚本＆GT;
＃函数myFunction的（）{
＃变种表=的document.getElementById（master_table）;
＃为（VAR I = 1; I＆LT; table.rows.length;我++）{
＃警报（table.rows [I] .cells [0] .innerHTML。）;
＃}
＃}
＃＆LT; / SCRIPT＆GT;
＃};
打印和LT; /头＆GT; \ N的;
}
打印QQ {
＆LT;表ID =master_table边界=0＆GT;
＆其中; TR＆GT;
百分位＆GT; COL1＆LT; /第i个
百分位＆GT; COL2＆LT; /第i个
百分位＆GT; COL3＆LT; /第i个
百分位＆GT; COL4＆LT; /第i个
＆LT; TD＆GT;＆安培; NBSP;＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆其中; TR＆GT;
＆LT; TD＆GT;
＆LT;输入类型=文本名称=COL1级=COL1/＆GT;
＆LT; / TD＆GT;
＆LT; TD＆GT;
＆LT;输入类型=文本名称=COL2级=COL2/＆GT;
＆LT; / TD＆GT;
＆LT; TD＆GT;
＆LT;输入类型=文本名称=COL3级=COL3/＆GT;
＆LT; / TD＆GT;
＆LT; TD＆GT;
＆LT;输入类型=文本名称=COL4级=COL4/＆GT;
＆LT; / TD＆GT;
＆LT; TD＆GT;
＆LT;输入类型=按钮NAME =addRow级=增加的价值=添加/＆GT;
＆LT; / TD＆GT;
＆LT; TD＆GT;
＆LT;输入类型=按钮NAME =removeRow级=removeRow值=删除/＆GT;
＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆其中; TR＆GT;
＆LT; TD合并单元格=4ALIGN =中心＆GT;
＆LT;输入类型=按钮NAME =submit_data级=提交值=提交的onclick =myFunction的（）/＆GT;
＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆LT; /表＆gt;
};
用于创建动态表的jQuery
$（文件）。就绪（函数（）{
$（文件）。在（'点击'，'＃master_table。新增'，函数（）{
VAR行= $（本）.closest（'潮流'）;
变种克隆= row.clone（）;
VAR TR = clone.closest（'潮流'）;
tr.find（'输入[类型=文本]'）VAL（''）。
$（本）.closest（TR）后（克隆）。
变量$跨度= $（＃master_table TR）;
$ span.attr（'身份证'，函数（指数）{
回归跨度+指数;
}）;
}）;
$（文件）。在（'点击'，'＃master_table .removeRow'，函数（）{
如果（$（'＃master_table。新增）长度大于1）{
$（本）.closest（TR）删除（）;
}
}）;
}）;
如果您使用HTML建立了一个动态表这将是更容易，并提交用户输入一个Perl脚本，以便进一步处理或assorting，作为必要的。
只是设计，看起来像一个表中的HTML表单（你可以使用大部分的$ C $的c您已经写的）。将其提交给perl脚本，你需要做的：
＆LT;形式的行动=/ somefolder / yourperlscript.pl的方法=POST＆GT;
＆LT;！ - 你的表在这里 - ＆GT;
＆LT; /形式GT;
您可能还记得，在Linux上文件的位置应以/somefolder/yourscript.pl，而在Windows上，应当以斜线在开始somefolder / yourscript.pl
After reading few threads from this forum , i was able to create a CGI page , with dynamic table in it. Now i need to capture the information entered in the table and store it in backend ( I am planning to store into db ).
Can someone please show me how do it . I heard that it can be done using jquery and AJAX. But i am new to web technology and stuck not knowing how to proceed with them.
NOTE: as I mentioned its a dynamic table. User add/delete rows as many as he wants. I need to capture all those data.
This is what i have tried so far
Perl CGI script
#!C:\Program Files\Perl\bin\perl
use strict;
use warnings;
use CGI qw{ :standard };
use CGI::Carp qw{ fatalsToBrowser };
print_page_header();
print_html_head_section();
#################
## Subroutines ##
#################
sub print_page_header {
print "Content-type: text/html\n\n";
}
sub print_html_head_section {
print "<head>\n";
print "<title>sample test page</title>\n";
print "<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'></script>\n";
print "<script src='../js/mastertable_rowcontrol.js' type='text/javascript'></script>\n";
#print qq{
# <script>
# function myFunction() {
# var table=document.getElementById("master_table");
# for (var i=1;i<table.rows.length;i++) {
# alert(table.rows.[i].cells[0].innerHTML);
# }
# }
# </script>
# };
print "</head>\n";
}
print qq{
<table id="master_table" border="0">
<tr>
<th>COL1</th>
<th>COL2</th>
<th>COL3</th>
<th>COL4</th>
<td> </td>
</tr>
<tr>
<td>
<input type="text" name="col1" class="col1"/>
</td>
<td>
<input type="text" name="col2" class="col2"/>
</td>
<td>
<input type="text" name="col3" class="col3"/>
</td>
<td>
<input type="text" name="col4" class="col4"/>
</td>
<td>
<input type="button" name="addRow" class="add" value='Add'/>
</td>
<td>
<input type="button" name="removeRow" class="removeRow" value='Delete'/>
</td>
</tr>
<tr>
<td colspan="4" align="center">
<input type="button" name="submit_data" class="submit" value="Submit" onclick="myFunction()"/>
</td>
</tr>
</table>
};
jquery used to create dynamic table
$(document).ready(function () {
$(document).on('click','#master_table .add',function () {
var row=$(this).closest('tr');
var clone = row.clone();
var tr= clone.closest('tr');
tr.find('input[type=text]').val('');
$(this).closest('tr').after(clone);
var $span=$("#master_table tr");
$span.attr('id',function (index) {
return 'span' + index;
});
});
$(document).on('click','#master_table .removeRow',function () {
if ($('#master_table .add').length > 1) {
$(this).closest('tr').remove();
}
});
});
It would be easier if you built a dynamic-table using HTML, and have it submit the user-input to a Perl script for further processing or assorting, as needed.
Just design a HTML Form that looks like a table (you can use most of the code you have already written). To submit it to the perl script, you need to do this:
<form action="/somefolder/yourperlscript.pl" method="POST">
<!-- Your Table here -->
</form>
You may remember, that in linux the location of your file should begin with "/somefolder/yourscript.pl" while on windows, it should be with the slash in the beginning "somefolder/yourscript.pl
这篇关于采用Perl CGI如何存储/发送由用户在动态表中输入数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
