緣起:
不久前在弄國發會的案子，在弄後台文字編輯時，想要 Multiline TextBox 裡的文字在存進資料表裡的時候，能依照文字能按照畫面上的樣子，看起來斷行的地方有斷行。
問題情境:
這邊再描述得清楚些，看一下範例頁面，這是 aspx 頁面
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="birdshiutest.aspx.cs" Inherits="Site.birdshiutest" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>birdshiutest</title>
<style>
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:TextBox runat="server" ID="txtInput" TextMode="MultiLine" Width="200" Height="100"></asp:TextBox><br />
<asp:Button runat="server" ID="btnSubmit" OnClick="btnSubmit_Click" Text="傳送"/> <br />
結果:<br />
<asp:Literal runat="server" ID="litResult"></asp:Literal>
</form>
</body>
</html>
這是 cs 頁面
using System;
namespace Site
{
public partial class birdshiutest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
litResult.Text = txtInput.Text;
}
}
}
很簡單的功能，點了按鈕之後，Literal 顯示我們輸入在 TextBox 的內容。輸入的內容超過 TextBox 的寬度時，它會自動幫你換行，但是實際取得內容後，它其實是沒有換行的，只是在 TextBox 裡看起來像有換行而已。
問題就是這樣，那，要如何讓我們取得 TextBox 的內容時，它的文字結構是跟他在畫面上顯示的一樣呢 (有斷行) ?
解決:
當 TextBox 設定 TextModule="Multiline" 的時候，它最後傳到前台的結果會是一個 textarea，所以我就往 textarea 這個方向去找，看到它有 wrap 這個屬性可以設定。
根據我的理解，它的意思大概是，如果把 wrap 設成 hard 的話，在 submit 時，就會把超出 textarea 寬度的那部份文字後面給加上 newline。
但奇怪的是，我在 aspx 編輯 TextBox 元件時，雖然有看到 Wrap 的屬性可以設定，但它的值是指定 True 或 False，而且我設成 True 之後，得到的結果也還是一樣，所以後來就從 cs 下手，在 Page Load 時，設定元件的 Attribute 。
using System;
namespace Site
{
public partial class birdshiutest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
txtInput.Attributes["wrap"] = "hard";
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
litResult.Text = txtInput.Text;
}
}
}
這樣 textarea 就會有 wrap="hard"
接著再 try 一次，看看結果....
嗯... 雖然有不同，但這樣看起來好像不是加 newline，而是加了空白。後來想到，\r\n 的字元好像不能直接在 html 頁面上做顯示，所以，要做置換，把它們給換成 <br> 標籤
using System;
namespace Site
{
public partial class birdshiutest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
txtInput.Attributes["wrap"] = "hard";
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
litResult.Text = txtInput.Text.Replace("\r\n", "<br>");
}
}
}
這樣就成功了 ~~~ 可以把有 newline 的內容存進資料表，到時呈現在網頁時，把 newline 給取代成 <br> 就能正常顯示了。
沒有留言:
張貼留言