作者:zccst
form表单
[b]一、表单基础[/b]
作用:用来向服务器端提交数据。将form表单里的所有内容一起提交到服务器端。
特点:
1,一个form表单应该只有一个submit的按钮。
2,上传多个文件如果分开上传应该使用多个表单;如果一起上传,则使用一个表单。
3,如果一个页面中有多个表单,则提交时,不同表单内的空间可以同名。
[b]二、动态创建表单[/b]
[b]三、避免表单重复提交[/b]
方案1,限制次数。
a. 使用onsubmit
使用οnsubmit="return startUpload()"
b. 设置按钮只按一次就失效
方案2,最后一次生效,把之前的覆盖。
上面采用就是。
参考:
http://developer.51cto.com/art/200912/166148.htm
http://hi.baidu.com/squiant/blog/item/21068ec59301afae8226ac09.html
其他:
a,通过js【上面已描述】
b,通过session
c,通过cookie
d,通过跳转
[b]四、onsubmit的使用[/b]
<form .... οnsubmit="return validate()"></form>
onsubmit事件就是针对<input type="submit" />的。
在js中,在validate函数进行验证等。默认返回true,即提交表单。指定返回false时,表单不提交。
form表单
[b]一、表单基础[/b]
作用:用来向服务器端提交数据。将form表单里的所有内容一起提交到服务器端。
特点:
1,一个form表单应该只有一个submit的按钮。
2,上传多个文件如果分开上传应该使用多个表单;如果一起上传,则使用一个表单。
3,如果一个页面中有多个表单,则提交时,不同表单内的空间可以同名。
[b]二、动态创建表单[/b]
<div id="upForms">
<form id="fileitemdiv1" action="<?php echo $this->createUrl('repairUpload'); ?>" method="post" enctype="multipart/form-data" target="upload_target">
<input type="file" name="repair_attached_file1" />
<input type="submit" name="submitBtn" value='立即上传' />
<span id="upload_repairinfo_success1" style="color:red;"></span>
<input type="hidden" name="selectedIndex" value="1" />
<!-- 记录上传成功后的id -->
<input type="hidden" name="upload_save_to_db_id" id="upload_save_to_db_id1" value="0" />
</form>
<iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
</div>
<div>
<input type="button" value="增加附件" onclick="addfile();">
<input type="hidden" id="up_success_file_ids" />
</div>
var filecount=1;
// 新增一个上传文件控件
function addfile(){
var filediv = document.getElementById("upForms");
var fileitemdiv = document.createElement("form");
filecount++;
var content = "<input type=file name=repair_attached_file"+
filecount + "> <input type=submit name=submitBtn value='立即上传' /> <a href='javascript:removefile("+
filecount + ");'>删除</a> <span id=upload_repairinfo_success"+
filecount + " style='color:red;'></span><input type=hidden value="+
filecount + " name=selectedIndex /> <input type=hidden name=upload_save_to_db_id id=upload_save_to_db_id"+
filecount + " value=0 />";
fileitemdiv.id = "fileitemdiv"+filecount;
fileitemdiv.method = "post";
fileitemdiv.enctype = "multipart/form-data";
fileitemdiv.target = "upload_target";
fileitemdiv.action = "<?php echo $this->createUrl('repairUpload'); ?>";
fileitemdiv.innerHTML = content;
filediv.appendChild(fileitemdiv);
}
//删除指定上传文件控件
function removefile(fileIndex){
var filediv = document.getElementById("upForms");
var fileitemdiv = document.getElementById("fileitemdiv"+fileIndex);
filediv.removeChild(fileitemdiv);
}
[b]三、避免表单重复提交[/b]
方案1,限制次数。
a. 使用onsubmit
使用οnsubmit="return startUpload()"
b. 设置按钮只按一次就失效
<input type="button" value="只提交一次" onclick="this.disabled=true;this.form.submit()" />
方案2,最后一次生效,把之前的覆盖。
上面采用就是。
参考:
http://developer.51cto.com/art/200912/166148.htm
http://hi.baidu.com/squiant/blog/item/21068ec59301afae8226ac09.html
其他:
a,通过js【上面已描述】
b,通过session
c,通过cookie
d,通过跳转
[b]四、onsubmit的使用[/b]
<form .... οnsubmit="return validate()"></form>
onsubmit事件就是针对<input type="submit" />的。
在js中,在validate函数进行验证等。默认返回true,即提交表单。指定返回false时,表单不提交。