[ASP.NET] FileUpload OnChange事件

這次客戶的需求是希望在檔案上傳時，

在一選擇完檔案的時候，就立刻自動把檔案的名字帶到另一個欄位，

讓使用者不必在手動輸入一次檔名。

一開始還苦於找不到CLIENTID，後來才知道原來可以把他設定為STATIC就好。

需求操作效果：

檔名不必自己手動輸入，自動帶出附件檔名。

作法如下：

首先在後台加入下面兩行

將要帶入檔名的textbox的ClientIDMode設為Static，
方便設值。
最後在fileupload的控制項上加上呼叫前端js的語法即可（下面那行）。

function GetFileName(value) {
         var path = value;
         var startIndex = path.lastIndexOf("\\");  //移除前面路徑
         var lastIndex = path.lastIndexOf(".");    //移除副檔名
         return path.substring(startIndex + 1, lastIndex);    //找出檔名回傳
     }

這是前台後台混用的作法，適用於動態產生的物件。

當然要全部只在前台產生也是可以的，如下：
物件宣告：

<asp:TextBox ID="TextBox1" runat="server" ClientIDMode="Static"></asp:TextBox>
<asp:FileUpload OnChange="validateFile(this.value);"  id="FileUpload1" name="FileUpload1"  runat="server"/>

js：

function validateFile(value) {
         var path = value;
         var startIndex = path.lastIndexOf("\\");
         var lastIndex = path.lastIndexOf(".");
 
         document.getElementById('TextBox1').value = path.substring(startIndex + 1, lastIndex);
     }

---

補充說明一點：

 FileUpload的OnChange事件在IDE中預設是隱藏的，但不代表不能用，

 原因不確定，不過好像是在前面幾個版本的其他瀏覽器是不適用的，

 現在的瀏覽器都測過可以用沒問題就是了:)

---

正規表示式：

搜尋檔名為
xofdfds.xx.aspx.dd
一二三.aspx.cs

用(\w+\.+)+
可以找到
xofdfds.xx.aspx.
一二三.aspx.
 
但想了老半天無法只找到xofdfds or 一二三
可改用
var r = s.replace(/^.*[\\\/]/, ''); //去除目錄路徑
r = r.replace(/[\.].*$/, ''); //去除副檔名
 

---

ClientIDMode參考：

[VS2010] ASP.NET 4.0 – 操控Server控制項的ClientIDhttp://www.dotblogs.com.tw/alonstar/archive/2010/01/18/13064.aspx