RadDock inside FormView EditItemTemplate

9 posts, 1 answers
  1. Phil H.
    Phil H. avatar
    88 posts
    Member since:
    Nov 2008

    Posted 01 Nov Link to this post

    Hi:

    I have placed RadDockZone and RadDoc inside of FormView EditItemTemplate.  The FormView's ItemUpdating event cannot seem to find the Bind values in the form.  If I remove the RadDockZone and RadDoc, it works as expected.

    Phil

  2. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 04 Nov Link to this post

    Hello Phil,

     

    I am not sure what exactly is the scenario that you have on your end. I tested a simple XML binding scenario with RadDock in the EditItemTemplate, but the fields from that source are properly propagated to the RadDock.

     

    Here you are code samples of the test case:

     

    <asp:FormView runat="server" ID="FormView1"
        DataSourceID="PeopleDataSource"
        AllowPaging="true"
        DataMember="Person">
     
        <ItemTemplate>
            <div><%# XPath ("Name/FirstName") %></div>
            <div><%# XPath ("Name/LastName") %></div>
            <asp:LinkButton ID="Edit"
                Text="Edit"
                CommandName="Edit"
                runat="server" />
        </ItemTemplate>
        <EditItemTemplate>
            <telerik:RadDockZone runat="server">
                <telerik:RadDock runat="server">
                    <ContentTemplate>
                        <asp:TextBox ID="FirstNameUpdateTextBox"
                            Text='<%# XPath ("Name/FirstName") %>'
                            runat="server" />
                        <asp:TextBox ID="LastNameUpdateTextBox"
                            Text='<%# XPath ("Name/LastName") %>'
                            runat="server" />
                        <asp:LinkButton ID="Update"
                            Text="Update"
                            CommandName="Update"
                            runat="server" />
                    </ContentTemplate>
     
                </telerik:RadDock>
            </telerik:RadDockZone>
        </EditItemTemplate>
    </asp:FormView>
     
    <asp:XmlDataSource
        ID="PeopleDataSource"
        runat="server"
        DataFile="~/App_Data/people.xml" />

     

    You can refer to this page for the XML: https://msdn.microsoft.com/en-us/library/494y92bs.aspx.  

     

    Regards,
    Ianko
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Phil H.
    Phil H. avatar
    88 posts
    Member since:
    Nov 2008

    Posted 17 Nov in reply to Ianko Link to this post

    Hi Lanko:

    Try changing your form to include a Updating form event:

    <asp:FormView runat="server" ID="FormView1"
        DataSourceID="PeopleDataSource"
        AllowPaging="true"
        DataMember="Person" OnItemUpdated="FormView1_ItemUpdated">
    ...

    Then add the following:

    protected void FormView1_ItemUpdated(object sender, FormViewUpdatedEventArgs e)
    {
        StringBuilder _msg = new StringBuilder("[smd: ");
        foreach (DictionaryEntry _entry in e.NewValues)
        {
            _msg.AppendFormat("{0}={1}, ", _entry.Key,
                (_entry.Value != null ? _entry.Value.ToString() : ""));
        }
        int _i = 0;
    }

    Set a break point on _i   I find that the dictionary is empty.  And the form yellow screens with the following:

    Specified method is not supported.
      Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.
     
     Exception Details: System.NotSupportedException: Specified method is not supported.
     
    Source Error:
     
     
     An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below. 
     
    Stack Trace:
     
     
     
    [NotSupportedException: Specified method is not supported.]
       System.Web.UI.DataSourceView.ExecuteUpdate(IDictionary keys, IDictionary values, IDictionary oldValues) +29
       System.Web.UI.DataSourceView.Update(IDictionary keys, IDictionary values, IDictionary oldValues, DataSourceViewOperationCallback callback) +87
       System.Web.UI.WebControls.FormView.HandleUpdate(String commandArg, Boolean causesValidation) +1136
       System.Web.UI.WebControls.FormView.HandleEvent(EventArgs e, Boolean causesValidation, String validationGroup) +425
       System.Web.UI.WebControls.FormView.OnBubbleEvent(Object source, EventArgs e) +89
       System.Web.UI.Control.RaiseBubbleEvent(Object source, EventArgs args) +37
       System.Web.UI.WebControls.FormViewRow.OnBubbleEvent(Object source, EventArgs e) +80
       System.Web.UI.Control.RaiseBubbleEvent(Object source, EventArgs args) +37
       System.Web.UI.WebControls.LinkButton.OnCommand(CommandEventArgs e) +121
       System.Web.UI.WebControls.LinkButton.RaisePostBackEvent(String eventArgument) +156
       System.Web.UI.WebControls.LinkButton.System.Web.UI.IPostBackEventHandler.RaisePostBackEvent(String eventArgument) +10
       System.Web.UI.Page.RaisePostBackEvent(IPostBackEventHandler sourceControl, String eventArgument) +13
       System.Web.UI.Page.RaisePostBackEvent(NameValueCollection postData) +9665034
       System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1724

     

    Phil

  5. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 21 Nov Link to this post

    Hello Phil H.,

    The same happens without the RadDock. Therefore, I am not exactly sure how this is relevant to the RadDock nested in the FormView. Also, the same exception is thrown without the RadDock.

    Regards,
    Ianko
    Telerik by Progress
    Telerik UI for ASP.NET AJAX is ready for Visual Studio 2017 RC! Learn more.
  6. Phil H.
    Phil H. avatar
    88 posts
    Member since:
    Nov 2008

    Posted 21 Nov Link to this post

    Hi Lanko:

    That is because your sample code does not have a Bind in the view.  I missed that initially.

    Phil

  7. Phil H.
    Phil H. avatar
    88 posts
    Member since:
    Nov 2008

    Posted 21 Nov Link to this post

    Hi Lanko:

    I created a simple people class and an access class:

    //
    public class People
    {
       public string FirstName { set; get; }
       public string LastName { set; get; }
       public string Street { set; get; }
       public string City { set; get; }
       public string Region { set; get; }
       public string ZipCode { set; get; }
       public string Title { set; get; }
       public string Description { set; get; }
    }
    public class PeopleAccess
    {
        public List<People> GetData()
        {
            return new List<People>(){
                new People {
                    FirstName = "Manoj",
                    LastName = "Syamala",
                    Street = "345 Maple St.",
                    City = "Redmond",
                    Region = "WA",
                    ZipCode = "01434",
                    Title = "CEO",
                    Description = "Develops company strategies."
                },
                new People {
                    FirstName = "Jared",
                    LastName = "Stivers",
                    Street = "123 Elm St.",
                    City = "Seattle",
                    Region = "WA",
                    ZipCode = "11223",
                    Title = "Attorney",
                    Description = "Reviews legal issues."
                }
            };
        }
    }

    Then I change the UI to not use xml:

    <asp:FormView runat="server" ID="FormView1"
        DataSourceID="PeopleDataSource"
        AllowPaging="true"
        OnItemUpdated="FormView1_ItemUpdated">
        <ItemTemplate>
            <div><%# Eval( "FirstName") %></div>
            <div><%# Eval( "LastName") %></div>
            <asp:LinkButton ID="Edit"
                Text="Edit"
                CommandName="Edit"
                runat="server" />
        </ItemTemplate>
        <EditItemTemplate>
            <telerik:RadDockZone ID="RadDockZone1" runat="server">
                <telerik:RadDock ID="RadDock1" runat="server">
                    <ContentTemplate>
                        <asp:TextBox ID="TextBox1"
                            Text='<%# Bind( "FirstName") %>'
                            runat="server" />
                        <asp:TextBox ID="TextBox2"
                            Text='<%# Bind( "LastName") %>'
                            runat="server" />
                        <asp:LinkButton ID="Update"
                            Text="Update"
                            CommandName="Update"
                            runat="server" />
                    </ContentTemplate>
                </telerik:RadDock>
            </telerik:RadDockZone>
        </EditItemTemplate>
    </asp:FormView>
    <asp:ObjectDataSource ID="PeopleDataSource" runat="server"
        TypeName="MMPA.MILC.WebUI.PeopleAccess"
        DataObjectTypeName="MMPA.MILC.WebUI.People"
        SelectMethod="GetData"
        >
    </asp:ObjectDataSource>

    You will have to adjust the class names in the ObjectDataSource...

    Now it fails to load the e.NewValues when the RadDock is used and load e.NewValues w/o the RadDock.

    Phil

  8. Answer
    Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 23 Nov Link to this post

    Hello Phil H.,

    I am not sure whether you hit yet another exception, but in this scenario here you should add additionally the UpdateMehtod of the ObjectDataSource control. 

    Further, RadDock's template will not be able to send the bound values to the server as the ASP template mechanism changes the name attribute of the form fields.

    You can fix that by having hidden inputs in the FormVie, which are programmatically updated when the textbox fields in the RadDock are changed. 

    Here you are a code example of this case:

    <asp:FormView runat="server" ID="FormView1"
        DataSourceID="PeopleDataSource"
        AllowPaging="true"
        OnItemUpdated="FormView1_ItemUpdated">
        <ItemTemplate>
            <div><%# Eval( "FirstName") %></div>
            <div><%# Eval( "LastName") %></div>
            <asp:LinkButton ID="Edit"
                Text="Edit"
                CommandName="Edit"
                runat="server" />
        </ItemTemplate>
        <EditItemTemplate>
            <asp:HiddenField ID="hiddenFirstName" runat="server" Value='<%# Bind( "FirstName") %>' ClientIDMode="Static"  />
            <asp:HiddenField ID="hiddenLastName" runat="server" Value='<%# Bind( "LastName") %>' ClientIDMode="Static" />
     
            <telerik:RadDockZone ID="RadDockZone1" runat="server" >
                <telerik:RadDock ID="RadDock1" runat="server" OnClientLoad="OnClientLoad" >
                    <ContentTemplate>
                        <asp:TextBox ID="TextBoxFirstName"
                            Text='<%# Bind( "FirstName") %>'
                            runat="server" CssClass="TextBoxFirstName" />
                        <asp:TextBox ID="TextBoxLastName"
                            Text='<%# Bind( "LastName") %>'
                            runat="server" CssClass="TextBoxLastName"  />
                        <asp:LinkButton ID="LinkButton1"
                            Text="Update"
                            CommandName="Update"
                            runat="server"  />
                    </ContentTemplate>
                </telerik:RadDock>
            </telerik:RadDockZone>
        </EditItemTemplate>
    </asp:FormView>
     
    <script>
        function OnClientLoad() {
            var $ = $telerik.$;
     
            var TextBoxFirstName = $(".TextBoxFirstName"),
                TextBoxLastName = $(".TextBoxLastName"),
                HiddenFirstName = $("#hiddenFirstName"),
                HiddenLastName = $("#hiddenLastName");
     
            TextBoxFirstName.change(function (ev) {
                HiddenFirstName.val($(TextBoxFirstName).val());
            })
     
            TextBoxLastName.change(function (ev) {
                HiddenLastName.val($(TextBoxLastName).val());
            })
     
        }
    </script>
     
    <asp:ObjectDataSource ID="PeopleDataSource" runat="server"
        TypeName="WebUISite.PeopleAccess"
        DataObjectTypeName="WebUISite.People"
        SelectMethod="GetData" UpdateMethod="UpdateData"></asp:ObjectDataSource>

    Regards,
    Ianko
    Telerik by Progress
    Telerik UI for ASP.NET AJAX is ready for Visual Studio 2017 RC! Learn more.
  9. Phil H.
    Phil H. avatar
    88 posts
    Member since:
    Nov 2008

    Posted 23 Nov in reply to Ianko Link to this post

    Hi Lanko:

    The bound items need to go from the form updating event to the data source updating event, but the form updating event could not find the controls/values.  I already know about needing the data source event.

    So your work-around is binding to hidden fields.  Not good in my opinion.

    Phil

  10. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 23 Nov Link to this post

    Hello Phil H.,

    I agree with you on this, however, it is how templates in ASP.NET Web Forms work. Putting a form field in a template will update the name attribute of this field with additional values (the ID of the parent control). This is the native way for Web Forms to handle ViewState.

    Therefore, having a template that nests an additional template, where the update source comes from will not update the state of the bound datasource to the original control. This is because the ViewState cannot handle this situation. Thus, workarounds such as the proposed one are needed for such complex cases when nesting templates.

    Regards,
    Ianko
    Telerik by Progress
    Telerik UI for ASP.NET AJAX is ready for Visual Studio 2017 RC! Learn more.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017