100分客户端表单javascript提交的问题,求高人帮忙修改一下!解决立即结帖!

时间:2022-01-07 10:32:07
我现做了一个用户控件,
photo.ascx  这里面有一个服务器控件 ID为 File1 的<INPUT type="file" size="50" runat="server" ID="File1" name="File1">

还有一上传按钮 (当然点击之后是运行CodeBehind的up_Click事件)
<asp:button id="up" runat="server" Text=" 上 传 "></asp:button>



在主页面upload.aspx调用它 (由于是继承的所以ID不一样)
if(document.Form1.Photo1_File1.value!=""){
xxxxxxxxxx
}
else
{
document.Form1.submit();   //就是这里的错!不知应怎么写!因为提交部分是用户控件
}

现在的问题就是 点上传按钮  当验证通过了之后,CodeBehind的事件不会被触发!而什么都没反映!!这跟按F5刷新没多大区别!求高人指正submit的错误!谢谢!

24 个解决方案

#1


document.Form1.submit(); 这里出错?html看看源代码里是否有name=Form1

#2


你的 Form的名字是叫Form1吗

#3


哇,孟子大哥终于来了,我好高兴呀,你是JAVASCRIPT高手呀~
能不能麻烦您帮我解决一下呀?  

upload.aspx 的html代码部分:
<form id="Form1" name="Form1" method="post" runat="server" enctype="multipart/form-data"> 

用户控件的html:
photo.ascx  <INPUT type="file" size="50" runat="server" ID="File1" name="File1">

上传按钮 (当然点击之后是运行CodeBehind的up_Click事件)
<asp:button id="up" runat="server" Text=" 上 传 "></asp:button>

注: 点这个上传按钮  是调用onclick的return test()函数,由此引发验证机制。


问题所在:  我觉得不是true或flase的逻辑问题,就是document.Form1.submit(); 的问题,致使photo.ascx的CodeBehind的up_Click事件无法执行!

<script>
var img=null;
var pflag=false;
function s()
{
if(document.Form1.Photo1_File1.value!=""){
if(img)img.removeNode(true);
img=document.createElement("img");
img.style.position="absolute";
img.style.visibility="hidden";
img.attachEvent("onreadystatechange",orsc);
img.attachEvent("onerror",oe);
document.body.insertAdjacentElement("beforeend",img);
img.src=document.Form1.Photo1_File1.value;}
else{
   alert("请选择要上传的文件!");
pflag=false;
   return false;}
}
function oe()
{
alert("请确认您上传的文件是图片文件!");
pflag=false;
return false;
}
function orsc()
{
if(img.readyState!="complete"){pflag=false;return false;}

if(img.fileSize>500*1024){
alert("文件大小不能大于500K!");pflag=false;return false;}
else{
pflag=true;
document.Form1.submit();
return true;
}
}

function test()
{
s();
return false;
}
</script>

#4


现在已进一步确定是 document.Form1.submit();  的问题!

因为这个是主的页面的提交函数~ 

而我的上传按钮 是用户控件ascx的~  这样提交的javascript代码应该怎么写?

document.Form1.Photo1_submit();   这样试过了行不通,

只要能达到触发 ascx的upClick服务器事件就行了~!

#5


自己顶一下,希望CSDN的高手前来帮助!解决立即给100分!在线等待!

#6


我也经常遇到这种情况!!!关注。。。。。。。。。

#7


强烈帮楼主顶一下

#8


我已成功一半了!!!但就是要按2次 [上传]按钮才可以submit!! 因为我把submit那行去掉了,然后在test()加函数! 不知道怎么办!!要返回2次true才submit,晕~~

以下是修改后的代码:
<script>
var img=null;
var pflag=false;
function s()
{
if(document.Form1.Photo1_File1.value!=""){
if(img)img.removeNode(true);
img=document.createElement("img");
img.style.position="absolute";
img.style.visibility="hidden";
img.attachEvent("onreadystatechange",orsc);
img.attachEvent("onerror",oe);
document.body.insertAdjacentElement("beforeend",img);
img.src=document.Form1.Photo1_File1.value;}
else{
   alert("  ^_^  请您选择要上传的文件!\n\n点[浏览]在硬盘上选你的文件然后点[上传]即可!");
pflag=false;
   return false;}
}
function oe()
{
alert("^_^ 噢!请确认您上传的文件是图片文件!");
pflag=false;
return false;
}
function orsc()
{
if(img.readyState!="complete"){pflag=false;return false;}

if(img.fileSize>500*1024){
alert("^_^ 噢!文件大小不能大于500K!\n\n如果可能的话请先用图片处理工具缩小!\n\n例如用PhotoShop之类的工具把图缩小!");pflag=false;return false;}
else{
pflag=true;
return true;
}
}

function test()
{
s();
if(pflag)
{
return true;
}
else
{
return false;
}
//return false;
}
</script>

#9


:)

#10


up

#11


#12


我不知道为什么要这样,可在UserControl中直接绑定到事件,再做如下处理:
假设你的用户控件为:Wuc,在加入到页面中的id号为wuc,则可在Wuc的用户控件中定义如下:
用户控件中有一按钮,id为Button1
public event EventHandler ButtonClick;

private void Button1_Click(object sender, System.EventArgs e)
{
if( this.ButtonClick != null )
ButtonClick(sender,e);
}

在用户控件的private void InitializeComponent()中加入:
this.Button1.Click += new System.EventHandler(this.Button1_Click);

在页面中这样处理:
先加入定义:protected Wuc wuc;
在页面的InitializeComponent()中加入:
wuc = this.FindControl("wuc1") as wuc;
wuc.ButtonClick += new EventHandler(wuc_ButtonClick);
并在页面中加入事件处理方法:
private void wuc_ButtonClick(object sender, EventArgs e)
{
//随便处理
}
这样用户控件的按钮事件就会响应页面的中定义的方法了。


#13


楼上的兄台,本主题讨论的是在客户端进行对 服务器控件的 javascript验证处理,又不是在服务器端,写这些好象也没用啊

#14


你在page_load里给button加一个click事件。
this.Button1.Attributes.Add("onclick","aa()");
然后把else里面的东西换成aa();
实现function aa(){}

#15


回复 xiaohutushen:

我本来就是这样做的呀,在[上传]按钮是加 return test() 这个的!
可能就是javascript的逻辑问题处理不好!不知您能否纠正一下逻辑!使最后可以return回test()本身才通过验证!!! 希望大家帮忙,这个问题已经捆饶了我12个小时了!

<script>
var img=null;
var pflag=false;
function s()
{
if(document.Form1.Photo1_File1.value!=""){
if(img)img.removeNode(true);
img=document.createElement("img");
img.style.position="absolute";
img.style.visibility="hidden";
img.attachEvent("onreadystatechange",orsc);
img.attachEvent("onerror",oe);
document.body.insertAdjacentElement("beforeend",img);
img.src=document.Form1.Photo1_File1.value;}
else{
   alert("  ^_^  请您选择要上传的文件!\n\n点[浏览]在硬盘上选你的文件然后点[上传]即可!");
pflag=false;
   return false;}
}
function oe()
{
alert("^_^ 噢!请确认您上传的文件是图片文件!");
pflag=false;
return false;
}
function orsc()
{
if(img.readyState!="complete"){pflag=false;return false;}

if(img.fileSize>500*1024){
alert("^_^ 噢!文件大小不能大于500K!\n\n如果可能的话请先用图片处理工具缩小!\n\n例如用PhotoShop之类的工具把图缩小!");pflag=false;return false;}
else{
pflag=true;
//__doPostBack('Photo1_up', '');
//document.forms["Form1"]
test();
return true;
}
}

function test()
{
s();
  strAppVersion = navigator.appVersion;
    if (pflag)
  {
  
  return true; }
  else
  {
   return false;
  }

//return false;
}
</script>

#16


我觉得你这个问题可能是这样造成的,在整个Script中只有一个函数orsc()
改变了pflag的值,它是在img的onreadystatechange事件发生后执行的,当你第一次点击上传的时候这个事件执行滞后于你点击按钮的时间较长,也就是还没等它改变pflag的值test就已经return false了,所以第一次点击没有响应

#17


如果网络一直是稳定的话可以这样
function test()
{
s();
pausecomp(1250);//根据网络速度调整
if(pflag)
{
return true;
}
else
{
return false;
}
//return false;
}
最好还是在服务器端验证文件大小

#18


错了,不是网络速度,是本机运行的速度

#19


把错误的那句话改为
document.Form1.Photo1_up.click();

#20


你的上传是做成一个用户控件的,可是用户控件在页面上 的时候,用户控件中的控件ID已经发现了变化,就是说Button的ID不是Photo1_File1
而是用户控件的ID加上Photo1_File1,所以,你用document.Form1.Photo1_File1.click()
是不起作用的,你可以看HTML的源代码,得到上传Button的值用户控件的ID加上_Photo1_File1

#21


回楼主第一贴

在<form id="Form1" name="Form1" method="post" runat="server" 
之前是否有<div id= "X1" name="X1".....  呢?
如果有要写成:
document.X1.Form1.submit(); 
才行的。

#22


回 freshtea(清鲜茶叶) :
 没有的,绝对没有呀。。。

回 fly_miss(新年新气象):
 好象也不行呀?

回 benbenyi(冬日彩虹):
 还是没法执行服务器的codebehind上传事件呀???

#23


runat = server

#24


实在对不起大家,不好意思搞错了, 楼上benbenyi(冬日彩虹)这位兄台提供的解决方案是正确的! 问题终于有了答案,感谢大家这一天来的热心帮助!特别感谢冬日彩虹 前辈!!!!
马上结贴送分!:)

#1


document.Form1.submit(); 这里出错?html看看源代码里是否有name=Form1

#2


你的 Form的名字是叫Form1吗

#3


哇,孟子大哥终于来了,我好高兴呀,你是JAVASCRIPT高手呀~
能不能麻烦您帮我解决一下呀?  

upload.aspx 的html代码部分:
<form id="Form1" name="Form1" method="post" runat="server" enctype="multipart/form-data"> 

用户控件的html:
photo.ascx  <INPUT type="file" size="50" runat="server" ID="File1" name="File1">

上传按钮 (当然点击之后是运行CodeBehind的up_Click事件)
<asp:button id="up" runat="server" Text=" 上 传 "></asp:button>

注: 点这个上传按钮  是调用onclick的return test()函数,由此引发验证机制。


问题所在:  我觉得不是true或flase的逻辑问题,就是document.Form1.submit(); 的问题,致使photo.ascx的CodeBehind的up_Click事件无法执行!

<script>
var img=null;
var pflag=false;
function s()
{
if(document.Form1.Photo1_File1.value!=""){
if(img)img.removeNode(true);
img=document.createElement("img");
img.style.position="absolute";
img.style.visibility="hidden";
img.attachEvent("onreadystatechange",orsc);
img.attachEvent("onerror",oe);
document.body.insertAdjacentElement("beforeend",img);
img.src=document.Form1.Photo1_File1.value;}
else{
   alert("请选择要上传的文件!");
pflag=false;
   return false;}
}
function oe()
{
alert("请确认您上传的文件是图片文件!");
pflag=false;
return false;
}
function orsc()
{
if(img.readyState!="complete"){pflag=false;return false;}

if(img.fileSize>500*1024){
alert("文件大小不能大于500K!");pflag=false;return false;}
else{
pflag=true;
document.Form1.submit();
return true;
}
}

function test()
{
s();
return false;
}
</script>

#4


现在已进一步确定是 document.Form1.submit();  的问题!

因为这个是主的页面的提交函数~ 

而我的上传按钮 是用户控件ascx的~  这样提交的javascript代码应该怎么写?

document.Form1.Photo1_submit();   这样试过了行不通,

只要能达到触发 ascx的upClick服务器事件就行了~!

#5


自己顶一下,希望CSDN的高手前来帮助!解决立即给100分!在线等待!

#6


我也经常遇到这种情况!!!关注。。。。。。。。。

#7


强烈帮楼主顶一下

#8


我已成功一半了!!!但就是要按2次 [上传]按钮才可以submit!! 因为我把submit那行去掉了,然后在test()加函数! 不知道怎么办!!要返回2次true才submit,晕~~

以下是修改后的代码:
<script>
var img=null;
var pflag=false;
function s()
{
if(document.Form1.Photo1_File1.value!=""){
if(img)img.removeNode(true);
img=document.createElement("img");
img.style.position="absolute";
img.style.visibility="hidden";
img.attachEvent("onreadystatechange",orsc);
img.attachEvent("onerror",oe);
document.body.insertAdjacentElement("beforeend",img);
img.src=document.Form1.Photo1_File1.value;}
else{
   alert("  ^_^  请您选择要上传的文件!\n\n点[浏览]在硬盘上选你的文件然后点[上传]即可!");
pflag=false;
   return false;}
}
function oe()
{
alert("^_^ 噢!请确认您上传的文件是图片文件!");
pflag=false;
return false;
}
function orsc()
{
if(img.readyState!="complete"){pflag=false;return false;}

if(img.fileSize>500*1024){
alert("^_^ 噢!文件大小不能大于500K!\n\n如果可能的话请先用图片处理工具缩小!\n\n例如用PhotoShop之类的工具把图缩小!");pflag=false;return false;}
else{
pflag=true;
return true;
}
}

function test()
{
s();
if(pflag)
{
return true;
}
else
{
return false;
}
//return false;
}
</script>

#9


:)

#10


up

#11


#12


我不知道为什么要这样,可在UserControl中直接绑定到事件,再做如下处理:
假设你的用户控件为:Wuc,在加入到页面中的id号为wuc,则可在Wuc的用户控件中定义如下:
用户控件中有一按钮,id为Button1
public event EventHandler ButtonClick;

private void Button1_Click(object sender, System.EventArgs e)
{
if( this.ButtonClick != null )
ButtonClick(sender,e);
}

在用户控件的private void InitializeComponent()中加入:
this.Button1.Click += new System.EventHandler(this.Button1_Click);

在页面中这样处理:
先加入定义:protected Wuc wuc;
在页面的InitializeComponent()中加入:
wuc = this.FindControl("wuc1") as wuc;
wuc.ButtonClick += new EventHandler(wuc_ButtonClick);
并在页面中加入事件处理方法:
private void wuc_ButtonClick(object sender, EventArgs e)
{
//随便处理
}
这样用户控件的按钮事件就会响应页面的中定义的方法了。


#13


楼上的兄台,本主题讨论的是在客户端进行对 服务器控件的 javascript验证处理,又不是在服务器端,写这些好象也没用啊

#14


你在page_load里给button加一个click事件。
this.Button1.Attributes.Add("onclick","aa()");
然后把else里面的东西换成aa();
实现function aa(){}

#15


回复 xiaohutushen:

我本来就是这样做的呀,在[上传]按钮是加 return test() 这个的!
可能就是javascript的逻辑问题处理不好!不知您能否纠正一下逻辑!使最后可以return回test()本身才通过验证!!! 希望大家帮忙,这个问题已经捆饶了我12个小时了!

<script>
var img=null;
var pflag=false;
function s()
{
if(document.Form1.Photo1_File1.value!=""){
if(img)img.removeNode(true);
img=document.createElement("img");
img.style.position="absolute";
img.style.visibility="hidden";
img.attachEvent("onreadystatechange",orsc);
img.attachEvent("onerror",oe);
document.body.insertAdjacentElement("beforeend",img);
img.src=document.Form1.Photo1_File1.value;}
else{
   alert("  ^_^  请您选择要上传的文件!\n\n点[浏览]在硬盘上选你的文件然后点[上传]即可!");
pflag=false;
   return false;}
}
function oe()
{
alert("^_^ 噢!请确认您上传的文件是图片文件!");
pflag=false;
return false;
}
function orsc()
{
if(img.readyState!="complete"){pflag=false;return false;}

if(img.fileSize>500*1024){
alert("^_^ 噢!文件大小不能大于500K!\n\n如果可能的话请先用图片处理工具缩小!\n\n例如用PhotoShop之类的工具把图缩小!");pflag=false;return false;}
else{
pflag=true;
//__doPostBack('Photo1_up', '');
//document.forms["Form1"]
test();
return true;
}
}

function test()
{
s();
  strAppVersion = navigator.appVersion;
    if (pflag)
  {
  
  return true; }
  else
  {
   return false;
  }

//return false;
}
</script>

#16


我觉得你这个问题可能是这样造成的,在整个Script中只有一个函数orsc()
改变了pflag的值,它是在img的onreadystatechange事件发生后执行的,当你第一次点击上传的时候这个事件执行滞后于你点击按钮的时间较长,也就是还没等它改变pflag的值test就已经return false了,所以第一次点击没有响应

#17


如果网络一直是稳定的话可以这样
function test()
{
s();
pausecomp(1250);//根据网络速度调整
if(pflag)
{
return true;
}
else
{
return false;
}
//return false;
}
最好还是在服务器端验证文件大小

#18


错了,不是网络速度,是本机运行的速度

#19


把错误的那句话改为
document.Form1.Photo1_up.click();

#20


你的上传是做成一个用户控件的,可是用户控件在页面上 的时候,用户控件中的控件ID已经发现了变化,就是说Button的ID不是Photo1_File1
而是用户控件的ID加上Photo1_File1,所以,你用document.Form1.Photo1_File1.click()
是不起作用的,你可以看HTML的源代码,得到上传Button的值用户控件的ID加上_Photo1_File1

#21


回楼主第一贴

在<form id="Form1" name="Form1" method="post" runat="server" 
之前是否有<div id= "X1" name="X1".....  呢?
如果有要写成:
document.X1.Form1.submit(); 
才行的。

#22


回 freshtea(清鲜茶叶) :
 没有的,绝对没有呀。。。

回 fly_miss(新年新气象):
 好象也不行呀?

回 benbenyi(冬日彩虹):
 还是没法执行服务器的codebehind上传事件呀???

#23


runat = server

#24


实在对不起大家,不好意思搞错了, 楼上benbenyi(冬日彩虹)这位兄台提供的解决方案是正确的! 问题终于有了答案,感谢大家这一天来的热心帮助!特别感谢冬日彩虹 前辈!!!!
马上结贴送分!:)