asp.net 如何更改FileUpload控件中按钮的Text并将值设置为textbox

mwyxok5s 于 2022-12-27 发布在 .NET

关注(0)|答案(3)|浏览(364)

嗨，我想使用C#上传文件，但要显示为下面的图像。

1.我想将按钮的文本从默认的“浏览”更改为“上传”。
1.当用户返回此页面时，我希望在文本框中显示他/她之前上传的图像名称。
经过一些搜索，我发现它不可能编辑按钮名称和设置文本框的值。
所以我开发了下面的编码。

.ASPX软件公司

<input runat="server" id="File1" type="file" style=" visibility:hidden;" />
                      <input id="Text1" type="text" runat="server" />
                      <asp:Button ID="Button1" OnClientClick="fireFileClick()" runat="server" Text="Upload" />

琼斯

function fireFileClick() {
            var objfile = document.getElementById("<%= File1.ClientID %>");
            objfile.click();

            var objTextBox = document.getElementById("<%= Text1.ClientID %>");
            objTextBox.value = objfile.value;
        }

.cs

private void SetPicture()
{
string strFileName = System.IO.Path.GetFileName(File1.PostedFile.FileName);
            string strExtnt = strFileName.Substring(strFileName.LastIndexOf('.') + 1).ToUpper();
            System.Drawing.Image UploadedImage = System.Drawing.Image.FromStream(File1.PostedFile.InputStream);
            float UploadedImageWidth = UploadedImage.PhysicalDimension.Width;
            float UploadedImageHeight = UploadedImage.PhysicalDimension.Height;
            if (UploadedImageWidth < 185 && UploadedImageHeight < 51)
            {
}
}

问题出在.CS中，我无法获取文件名和路径。变量strFileName、strExtnt返回空。一些正文指导我。

asp.net

来源：https://stackoverflow.com/questions/19089672/how-to-change-text-of-button-in-fileupload-control-and-set-value-to-textbox

3条答案

按热度按时间

dwthyt8l1#

你可以做这样的事。

.Aspx：

<input id="File1" type="file" runat="server" style="visibility: hidden"
    onchange="this.form.submit();" />
<input id="Button2" type="button" onclick="fireFileClick();" value="Upload" />

脚本：

function fireFileClick() {
    document.getElementById("<%= File1.ClientID %>").click();
}

.cs：与您的相同。

注意：您可以随意更改JavaScript中提交表单的方式，我只是使用了最快的方式。表单将在用户选择文件后提交。*

赞(0）回复(0）举报 2022-12-27

m528fe3b2#

查看此链接：ref
基本上使用两个输入控件，隐藏实际的输入上载控件，并对非文件上载控件应用样式。

赞(0）回复(0）举报 2022-12-27

tkclm6bt3#

使用两个js文件http://the-echoplex.net/demos/upload-file/file-upload.js和http://the-echoplex.net/demos/upload-file/jelly/min.js。并添加file-upload.css文件。示例aspx文件是，

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
 <html xmlns="http://www.w3.org/1999/xhtml">  
 <script src="script/jelly.js" type="text/javascript"></script>  
   <style type="text/css">  
 /****************** Start page styles ********************************************/  
 body {  
      background: #DFA01B;  
      font-family: arial, sans-serif;  
      font-size: 11px;  
      }  
 #wrap {  
      max-width: 600px;  
      margin: 30px auto;  
      background: #fff;  
      border: 4px solid #FFD16F;  
      -moz-border-radius: 15px;  
      -webkit-border-radius: 15px;  
      border-radius: 15px;  
      padding: 20px;  
   }  
 .field {   
      padding: 0 0 1em;   
      }  
 </style>  
 <head runat="server">  
   <title></title>  
 </head>  
 <body>  
   <form id="form1" runat="server">  
   <div id="wrap">  
 <form enctype="multipart/form-data" action="#" method="post">  
      <div class="field">  
           <label class="file-upload">  
                <span><strong>Put YOUR TEXT</strong></span>  
                <%--<input type="file" name="uploadfile" onclintclick="test_load()" />--%>  
       <asp:FileUpload  
         ID="FileUpload1" name="uploadfile" runat="server"   
       ondatabinding="FileUpload1_DataBinding" />  
           </label>  
      </div>  
 </form>  
 </div><!--/ wrap -->  
   <script src="script/file-upload.js" type="text/javascript"></script>  
   </form>  
 </body>  
 </html>

和CSS文件，

body {
}
/* 

    As this stylesheet is lazy loaded these styles only apply if JavaScript is enabled

*/  
.file-upload {
    overflow: hidden;
    display: inline-block;
    position: relative; 
    vertical-align: middle;
    text-align: center;

    /* Cosmetics */
    color: #fff;
    border: 2px solid #2FA2FF;
    background: #6FBEFF;

    /* Nice if your browser can do it */
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    text-shadow: #000 1px 1px 4px;
    }

.file-upload:hover { 
    background: #2FA2FF; 
    }

.file-upload.focus { 
    outline: 2px solid yellow;
    }

.file-upload input {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    font-size: 70px;

    /* Loses tab index in webkit if width is set to 0 */
    opacity: 0;
    filter: alpha(opacity=0);
    }

.file-upload strong { 
    font: normal 1.75em arial,sans-serif; 
    }   

.file-upload span {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;

    /* Adjust button text vertical alignment */
    padding-top: .45em;
    }

/* Adjust the button size */    
.file-upload { height: 3em; }
.file-upload,
.file-upload span { width: 14em; }  

.file-upload-status {
    margin-left: 10px;
    vertical-align: middle;
    padding: 7px 11px;
    font-weight: bold;  
    font-size: 16px;
    color: #888;
    background: #f8f8f8;
    border: 3px solid #ddd;
    }

你可以在changedfileuploadbutton text下载示例项目

赞(0）回复(0）举报 2022-12-27

我来回答

asp.net 如何更改FileUpload控件中按钮的Text并将值设置为textbox

3条答案

相关问题

热门标签

最新问答