Как изменить текст кнопки в элементе управления FileUpload и установить значение в текстовое поле

Привет, я хочу загрузить файл с помощью C#, но хочу отобразить его как показано ниже.Как изменить текст кнопки в элементе управления FileUpload и установить значение в текстовое поле

enter image description here

Я хочу, чтобы изменить текст кнопки из умолчанию «Обзор» «Загрузить».
Когда пользователь возвращается на эту страницу, я хочу показать имя изображения, которое он ранее загружал в текстовое поле.

После некоторого поиска я обнаружил, что невозможно изменить имя кнопки и установить значение для текстового поля.

Итак, я разработал ниже кодировку.

.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 им не получить файл NAM е и путь. переменная strFileName, strExtnt возвращается пустым. какое-то тело направляют меня.

источник

2013-09-30 Ryder

Вы можете сделать что-то вроде этого.

.aspx:

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

JavaScript:

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

.cs: То же самое, как ваша.

Примечание: не стесняйтесь изменить способ отправки формы в JavaScript, я просто использовал самый быстрый способ. Форма будет отправлена после выбора файла пользователем.

источник

2013-09-30 11:00:10

Проверить эту ссылку: ref
основном использует два элемента управления ввода, скрывающую фактический контроль входной загрузки, и применяется стиль для контроля загрузки без файла. Удивительный соус!

источник

2013-11-15 21:12:02 devjc

-1

с использованием двух Js файлов http://the-echoplex.net/demos/upload-file/file-upload.js и http://the-echoplex.net/demos/upload-file/jelly/min.js .И добавить файл-upload.css file.Your образец 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

источник

2016-02-18 11:21:31

Как изменить текст кнопки в элементе управления FileUpload и установить значение в текстовое поле

ответ

Смежные вопросы