質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.91%

C#.Net ListView内のテキストエリアが改行できなくなる

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 359

kkkkui

score 6

お世話になっております。
不勉強なため、記載内容に不足ありましたら
ご指摘お願い致します。

前提・実現したいこと

C#.NetのWebページで、
追加ボタンを押すとListView内に入力フォームが現れ
入力フォーム内の確定ボタンを押すと
参照用入力フォームに変化する。
(再度追加ボタンを押すと入力フォームが追加される)
という動作を実現させようとしており、凡そうまくいっているのですが
テキストエリアの挙動が以下のようにおかしい状態です。

発生している問題・エラーメッセージ

入力フォーム内のテキストエリアが、なぜか改行ができません。
改行ができない、というのは
文字を打ってEnterを押しても改行されない、ということです。

該当のソースコード

<form id="form1" runat="server" style="width:300px;">
 <asp:ListView ID="LvwConsultation" runat="server" style="" 
     OnItemDataBound="LvwConsultation_ItemDataBound" 
     OnItemEditing="LvwConsultation_ItemEditing" 
     OnItemUpdating="LvwConsultation_ItemUpdating" 
     OnItemDeleting="LvwConsultation_ItemDeleting" 
     OnItemCanceling="LvwConsultation_ItemCanceling">
    <EmptyDataTemplate>
        <table runat="server">
            <tr>
                <td>まだ登録されていません。</td>
            </tr>
        </table>
    </EmptyDataTemplate>
    <LayoutTemplate>
        <table id="itemPlaceholderContainer" runat="server">
            <tr id="itemPlaceholder" runat="server">
            </tr>
        </table>
    </LayoutTemplate>
    <ItemTemplate>
        <tr id="Tr1" runat="server">
            <td id="Td1" runat="server" style="border:1px solid #CCCCCC;">
                <table id="TblRow" runat="server" style="width:284px;">
                    <tr id ="Tr1_2" runat="server">
                        <td id="Td1_1" style="width:80px;">
                            <label class="input-title-right" style="height:12px">相談日</label>
                        </td>
                        <td id="Td1_2" style="width:150px;">
                            <asp:Label id="LblConsultationDate" class="uninput" runat="server" style="width:90px;" ></asp:Label>
                        </td>
                        <td>
                            <asp:ImageButton ID="ImgEdit" runat="server" ImageUrl="../../Images/edit.png" title="訂正します" style="height:15px; width:15px;" CommandName="Edit" />
                            <asp:ImageButton ID="ImgDelete" runat="server" ImageUrl="../../Images/delete.png" title="削除します" style="height:15px; width:15px;" CommandName="Delete" />
                        </td>
                    </tr>
                    <tr id ="Tr4_2" runat="server">
                        <td colspan="3">
                            <asp:Label ID="LblConsultation" runat="server" style="width:100%;" />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </ItemTemplate>
    <EditItemTemplate>
        <tr id="Tr1" runat="server">
            <td id="Td1" runat="server" style="border:1px solid #CCCCCC;">
                <table id="TblRow" runat="server" style="width:284px;">
                    <tr id ="Tr1_2">
                        <td id="Td1_1" style="width:100px;">
                            <label class="input-title-right" style="height:12px">日付<span style="color:red">*</span></label>
                        </td>
                        <td id="Td1_2" style="width:100px;">
                            <asp:TextBox id="CalConsultationDate" class="uninput" runat="server" style="width:90px;" ></asp:TextBox>
                        </td>
                        <td>
                            <table>
                                <tr>
                                    <td style="vertical-align:top">
                                        <asp:Button id="BtnConfirm" runat="server" Text="確定" style="width:40px; height:20px; padding: 0px; text-align:center; margin-right:3px; margin-bottom:3px;" UseSubmitBehavior="False" OnClientClick="if(!BtnConfirm_OnClientClick(this)) {return false;};" CommandName="Update" />
                                    </td>
                                    <td style="vertical-align:top">
                                        <asp:Button id="BtnClose" runat="server" Text="キャンセル" style="width:50px; height:20px; padding: 0px; text-align:center; margin-right:3px;" UseSubmitBehavior="False" CommandName="Cancel" />
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="3">
                            <asp:TextBox ID="TxtConsultation" runat="server" TextMode="MultiLine" style="width:98%;" Wrap="True" ></asp:TextBox>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </EditItemTemplate>
</asp:ListView>

試したこと

ListViewの外に配置している以下のテキストエリアは
正常に改行できていたので、それをListView内に入れたとたん
改行できなくなってしまいました。
<asp:TextBox id="TxtResult" runat="server" Rows="10" TextMode="MultiLine" Width="97%" >

補足情報(FW/ツールのバージョンなど)

C#
.Net Framework4.0

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • SurferOnWww

    2020/07/16 15:01

    問題のテキストボックスは質問のコードの最後の方にある <asp:TextBox ID="TxtConsultation" ... TextMode="MultiLine" ... ですよね? であれば ListView の中にあろうと外にあろうと html にレンダリングされると textarea 要素になるので、「文字を打ってEnterを押しても改行されない」ということはないはずなのですが? 何か勘違いとか? html ソースを見てください。

    キャンセル

  • SurferOnWww

    2020/07/17 07:41

    html ソースは見てもらえたでしょうか? どうして改行できないのか自分も大変興味があります。情報共有に協力いただけると幸いです。

    キャンセル

  • SurferOnWww

    2020/07/19 13:03

    質問者さん、無言になってしまいましたが、上でお願いしたように html ソースは見てもらえたでしょうか? どうして改行できないのか自分も大変興味があります。

    https://teratail.com/help/question-tips に書いてありますが、Teratail は「質問と回答を通してお互いに知識や情報を交換・共有する場所」「お互いの好意の上に成り立っている助け合いの場」ということです。情報共有に協力いただけると幸いです。

    キャンセル

回答 1

checkベストアンサー

0

問題のテキストボックスは質問のコードの最後の方にある <asp:TextBox ID="TxtConsultation" ... TextMode="MultiLine" ... ですよね?

であれば ListView の中・外関係なく html にレンダリングされると textarea 要素になるので、「文字を打ってEnterを押しても改行されない」ということはないはずなのですが?

一応確認しましたが、[編集]ボタンをクリックして編集モードに入ると EmptyDataTemplate が表示され、その中の Notes 列が textarea になるので以下のように表示されます。textarea なのでもちろん改行はできるし、[更新]ボタンをクリックすると編集結果は DB に反映されます。

イメージ説明

ただし、[更新]ボタンクリックでポストバックされ、再描画される際は ItemTemplate が表示され、その中の Notes 列は Label なので CRLF という改行コードでは改行はされません。以下のようになります。それと勘違いしているということはないですか。

イメージ説明

確認に使ったコードを以下にアップしておきます。DB は Microsoft のサンプルデータベース Northwind の Employees テーブルを使っています。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm9.aspx.cs" 
    Inherits="WebApplication1.WebForm9" %>

<!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></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
                ConnectionString="<%$ ConnectionStrings:NORTHWINDConnectionString %>" 
                SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title], [Notes] FROM [Employees]" 
                UpdateCommand="UPDATE [Employees] SET [LastName] = @LastName, [FirstName] = @FirstName, [Title] = @Title, [Notes] = @Notes WHERE [EmployeeID] = @EmployeeID">
                <UpdateParameters>
                    <asp:Parameter Name="LastName" Type="String" />
                    <asp:Parameter Name="FirstName" Type="String" />
                    <asp:Parameter Name="Title" Type="String" />
                    <asp:Parameter Name="Notes" Type="String" />
                    <asp:Parameter Name="EmployeeID" Type="Int32" />
                </UpdateParameters>
            </asp:SqlDataSource>

            <asp:ListView ID="ListView1" runat="server" DataKeyNames="EmployeeID" DataSourceID="SqlDataSource1">
                <EditItemTemplate>
                    <tr style="">
                        <td>
                            <asp:Button ID="UpdateButton" runat="server" CommandName="Update" Text="更新" />
                            <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="キャンセル" />
                        </td>
                        <td>
                            <asp:Label ID="EmployeeIDLabel1" runat="server" Text='<%# Eval("EmployeeID") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="LastNameTextBox" runat="server" Text='<%# Bind("LastName") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="FirstNameTextBox" runat="server" Text='<%# Bind("FirstName") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="TitleTextBox" runat="server" Text='<%# Bind("Title") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="NotesTextBox" runat="server" Text='<%# Bind("Notes") %>' 
                                TextMode="MultiLine" Width="300px" Height="200px" />
                        </td>
                    </tr>
                </EditItemTemplate>
                <EmptyDataTemplate>
                    <table runat="server" style="">
                        <tr>
                            <td>データは返されませんでした。</td>
                        </tr>
                    </table>
                </EmptyDataTemplate>
                <ItemTemplate>
                    <tr style="">
                        <td>
                            <asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="編集" />
                        </td>
                        <td>
                            <asp:Label ID="EmployeeIDLabel" runat="server" Text='<%# Eval("EmployeeID") %>' />
                        </td>
                        <td>
                            <asp:Label ID="LastNameLabel" runat="server" Text='<%# Eval("LastName") %>' />
                        </td>
                        <td>
                            <asp:Label ID="FirstNameLabel" runat="server" Text='<%# Eval("FirstName") %>' />
                        </td>
                        <td>
                            <asp:Label ID="TitleLabel" runat="server" Text='<%# Eval("Title") %>' />
                        </td>
                        <td>
                            <asp:Label ID="NotesLabel" runat="server" Text='<%# Eval("Notes") %>' />
                        </td>
                    </tr>
                </ItemTemplate>
                <LayoutTemplate>
                    <table runat="server">
                        <tr runat="server">
                            <td runat="server">
                                <table id="itemPlaceholderContainer" runat="server" border="0" style="">
                                    <tr runat="server" style="">
                                        <th runat="server"></th>
                                        <th runat="server">EmployeeID</th>
                                        <th runat="server">LastName</th>
                                        <th runat="server">FirstName</th>
                                        <th runat="server">Title</th>
                                        <th runat="server">Notes</th>
                                    </tr>
                                    <tr id="itemPlaceholder" runat="server">
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr runat="server">
                            <td runat="server" style=""></td>
                        </tr>
                    </table>
                </LayoutTemplate>
            </asp:ListView>
        </div>
    </form>
</body>
</html>

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/07/19 13:04

    質問者さん、無言になってしまいましたが、上でお願いしたように html ソースは見てもらえたでしょうか? どうして改行できないのか自分も大変興味があります。

    https://teratail.com/help/question-tips に書いてありますが、Teratail は「質問と回答を通してお互いに知識や情報を交換・共有する場所」「お互いの好意の上に成り立っている助け合いの場」ということです。情報共有に協力いただけると幸いです。

    キャンセル

  • 2020/07/20 13:36

    SurferOnWww様
    返答が大変遅くなり申し訳ありません。(体調崩して出勤しておりませんでした)

    本日改めてHTMLを確認したのですが、
    結論から申し上げますと私の勘違い…と言いますか、
    掲示したソース以外の箇所に問題がありました。

    具体的には、javascriptに以下の記述がありました。
    =====================
    $("body").on("keydown", function (e) {
    if ((e.which || e.keyCode) == 13
    || ((e.which || e.keyCode) == 116)) {
    return false;
    }
    });
    =====================

    不要だったので削除していたはずだったので、盲点となっていました。
    大変申し訳ありませんでした。

    ですが、SurferOnWww様のご助言通り、HTMLを確認したら
    すぐに解決できましたので、今後の対応方法に取り入れたいと思います。
    ありがとうございました。

    キャンセル

  • 2020/07/20 13:57

    情報提供をありがとうございました。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.91%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る