当用户在RichTextBox中输入大量数据时，显示“显示更多”选项

Question

我有一个Richtextbox和一个gridview。

当我将数据输入到richtextbox中时，应将其显示在gridview中并保存在数据库中。

现在我的要求是，如果我输入一个段落或大量数据，我应该显示一个“ readmore”按钮，当单击该按钮时，应显示完整的数据。

<%@ Register Assembly="FreeTextBox" Namespace="FreeTextBoxControls" TagPrefix="FTB" %>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <title>Richtextbox Sample</title>
    <script type="text/javascript">
        function validate() {
            var doc = document.getElementById('FreeTextBox1');
            if (doc.value.length == 0) {
                alert('Please Enter data in Richtextbox');
                return false;
            }
        }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <table>
                    <tr>
                        <td>
                            <FTB:FreeTextBox ID="FreeTextBox1" runat="server">
                            </FTB:FreeTextBox>
                        </td>
                        <td valign="top">
                            <asp:GridView runat="server" ID="gvdetails" AutoGenerateColumns="false">
                                <Columns>
                                    <asp:TemplateField HeaderText="RichtextBoxData">
                                        <ItemTemplate>
                                            <asp:Label ID="lbltxt" runat="server" Text='<%#Bind("RichtextData") %>'/>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                </Columns>
                            </asp:GridView>
                        </td>
                    </tr>
                </table>
            </div>

            <asp:Button ID="btnSubmit" runat="server" OnClientClick="return validate()"
            Text="Submit" onclick="btnSubmit_Click" />
            <br />
            <asp:Label ID="lbltxt" runat="server"/>

        </form>
    </body>
</html>

C＃代码

SqlConnection con = new SqlConnection("Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB");

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
        BindGridview();
}

protected void BindGridview()
{
    con.Open();
    SqlCommand cmd = new SqlCommand("select RichTextData from RichTextBoxData", con);
    SqlDataAdapter da = new SqlDataAdapter(cmd);
    DataSet ds = new DataSet();
    da.Fill(ds);
    gvdetails.DataSource = ds;
    gvdetails.DataBind();
}

protected void btnSubmit_Click(object sender, EventArgs e)
{
    con.Open();
    SqlCommand cmd = new SqlCommand("insert into RichTextBoxData(RichTextData) values(@Richtextbox)", con);
    cmd.Parameters.AddWithValue("@Richtextbox", FreeTextBox1.Text);
    cmd.ExecuteNonQuery();
    con.Close();
    FreeTextBox1.Text = "";
    BindGridview();
}

Answer 1

首先在您的选择查询中添加文本的ID（您的表RichTextBoxData的主键），然后在gridview中使其可见，像这样的= false

       <asp:TemplateField HeaderText="id" InsertVisible="False" Visible="False">

        <ItemTemplate>
   <asp:Label ID="Label2" runat="server" Text='<%# Bind("id") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>

接着

    protected void gvdetails_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {


            Label lb =e.Row.FindControl("lbltxt") as Label;

            if (lb.Text.Length > 15)//any length u want
            {

                DataRow drv = ((DataRowView)e.Row.DataItem).Row;

                int tempID = Convert.ToInt32(drv["id"].ToString());

                HyperLink hp = new HyperLink();
                hp.Text = "read more";
                hp.NavigateUrl = "~/mydetails.aspx?id=" + tempID;
               e.Row.Cells[1].Controls.Add(hp);
              lb.Text = lb.Text.Substring(0, 15);


            }

        }
    }

并在mydetails.aspx的page_load上进行查询以选择RichTextData，其中id = request.querystring [“ id”]

当用户在RichTextBox中输入大量数据时，显示“显示更多”选项

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-03-18 22:01:54

当用户在RichTextBox中输入大量数据时，显示“显示更多”选项

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-03-18 22:01:54

解决方案1
0 已采纳 2016-03-18 22:01:54