如何在网格中插入HTML编辑器?

时间:2013-07-31 09:12:44

标签: asp.net html5 datagrid telerik html-editor

您好,我正在使用'试用Tekerik Controls',我正在构建Grid。现在,当我按“编辑”然后选择行ShortDescription时,我想在网格中插入HTML编辑控件。我希望打开HTML控件,以便我可以编辑其中的所有信息。

enter image description here

你可以在这里看到这个例子。

这是我的代码

 <telerik:RadGrid ID="RadGrid1" runat="server" ShowGroupPanel="True" GridLines="None" DataSourceID="DataSource1" AllowFiltering="False" AllowAutomaticDeletes="True" AllowAutomaticInserts="True" AllowAutomaticUpdates="True" AllowFilteringByColumn="True" AutoGenerateDeleteColumn="True" AutoGenerateEditColumn="True" CellSpacing="0">
                <MasterTableView GroupLoadMode="client" ShowGroupFooter="False" GroupsDefaultExpanded="False" AutoGenerateColumns="False" DataKeyNames="ID">
                    <Columns>
                        <telerik:GridBoundColumn DataField="ID" DataType="System.Int32" FilterControlAltText="Filter ID column" HeaderText="ID" ReadOnly="True" SortExpression="ID" UniqueName="ID">
                        </telerik:GridBoundColumn>
                        <telerik:GridCheckBoxColumn DataField="LoadCategory" DataType="System.Boolean" FilterControlAltText="Filter LoadCategory column" HeaderText="LoadCategory" SortExpression="LoadCategory" UniqueName="LoadCategory">
                        </telerik:GridCheckBoxColumn>
                        <telerik:GridBoundColumn DataField="ProductCategory" FilterControlAltText="Filter ProductCategory column" HeaderText="ProductCategory" SortExpression="ProductCategory" UniqueName="ProductCategory">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="ShortDescription" FilterControlAltText="Filter ShortDescription column" HeaderText="ShortDescription" SortExpression="ShortDescription" UniqueName="ShortDescription">

                          <%-- This is the row --%>
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="NumberOfItems" DataType="System.Int16" FilterControlAltText="Filter NumberOfItems column" HeaderText="NumberOfItems" SortExpression="NumberOfItems" UniqueName="NumberOfItems">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="CategoryTitle" FilterControlAltText="Filter CategoryTitle column" HeaderText="CategoryTitle" SortExpression="CategoryTitle" UniqueName="CategoryTitle">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="SeoTitle" FilterControlAltText="Filter SeoTitle column" HeaderText="SeoTitle" SortExpression="SeoTitle" UniqueName="SeoTitle">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="SeoDescription" FilterControlAltText="Filter SeoDescription column" HeaderText="SeoDescription" SortExpression="SeoDescription" UniqueName="SeoDescription">
                        </telerik:GridBoundColumn>
                    </Columns>
                </MasterTableView>
                <ClientSettings AllowDragToGroup="True">
                </ClientSettings>
            </telerik:RadGrid>

我有什么想法可以做到这一点?

2 个答案:

答案 0 :(得分:1)

使用UserControlEditForm

    <EditFormSettings UserControlName="yourUserControl.ascx" EditFormType="WebUserControl">
            <EditColumn FilterControlAltText="Filter EditCommandColumn column">
            </EditColumn>
    </EditFormSettings>

yourUserControl.ascx中,您可以添加telerik RadEditor或其他一些html编辑器。

这是如何从Grid获取值到userControl,

  object _fieldValue = DataBinder.Eval(DataItem, "YourDataField");
        if ((_fieldValue != DBNull.Value) && (_fieldValue != null))
        {
            yourHtmlEditor.Text = _fieldValue .ToString();

        }

这就是如何从userControl获取值到主网格

  UserControl usercontrol = (UserControl)e.Item.FindControl(GridEditFormItem.EditFormUserControlID);
  string _value= (usercontrol.FindControl("yourHtmlEditor") as typeOfyourEditor).Text;

您可以看到reference1reference2

不使用userControlEditForm,您可以使用editFormTemplate

 <EditFormSettings EditFormType="Template">
            <FormTemplate>

请参阅demo1demo2

祝你好运:)

答案 1 :(得分:0)

我找到了你需要改变的解决方案

  <telerik:GridBoundColumn DataField="ShortDescription" FilterControlAltText="Filter ShortDescription column" HeaderText="ShortDescription" SortExpression="ShortDescription" UniqueName="ShortDescription">
                        </telerik:GridBoundColumn>

GridHTMLEditorColumn

 <telerik:GridHTMLEditorColumn DataField="ShortDescription" FilterControlAltText="Filter ShortDescription column" HeaderText="ShortDescription" SortExpression="ShortDescription" UniqueName="ShortDescription">
                        </telerik:GridHTMLEditorColumn>