Prepopulate fields in a dataform on combobox selectedindexchange

3 posts, 0 answers
  1. Simon
    Simon avatar
    12 posts
    Member since:
    Nov 2014

    Posted 17 Dec 2014 Link to this post

    Hi, I'm pretty new to asp.net and Ajax and I'm trying to write a simple apps that will update and create news for our intranet.

    The scenario is pretty simple.
    I have a radgrid that list all the news, and a dataform that show the item selected from the grid.
    So far so good. Editing and inserting new item works.

    However, I need to prepopulate some fields ( or edit some existing data ) when I change the value of my combobox inside the dataform.

    Here the markup
    <telerik:RadAjaxManagerProxy ID="ramp1" runat="server">
             <AjaxSettings >
                 <telerik:AjaxSetting AjaxControlID="RadDataForm1" >
                     <UpdatedControls >
                         <telerik:AjaxUpdatedControl ControlID="gridPanel" LoadingPanelID="RadAjaxLoadingPanel1" />
                     </UpdatedControls >
                 </telerik:AjaxSetting >
                 <telerik:AjaxSetting AjaxControlID="RadGrid1">
                     <UpdatedControls>
                         <telerik:AjaxUpdatedControl ControlID="editorPanel" LoadingPanelID="RadAjaxLoadingPanel1" />
                     </UpdatedControls>
                 </telerik:AjaxSetting>
             </AjaxSettings >
        </telerik:RadAjaxManagerProxy>
         
        <div id="editor" style="float:left;">
            <asp:Panel ID="editorPanel" runat="server" >
                <telerik:RadAjaxPanel runat="server" ID="test2" LoadingPanelID="RadAjaxLoadingPanel2">
                <telerik:RadDataForm ID="RadDataForm1" runat="server" DataSourceID="EntityDataSource2" OnItemUpdated="RadDataForm1_ItemUpdated" OnItemInserted="RadDataForm1_ItemInserted" DataKeyNames="ID" OnPreRender="RadDataForm1_PreRender" >
                    <LayoutTemplate>
                        <div class="RadDataForm RadDataForm_<%# Container.Skin %> rdfLeftAligned rdfNoFieldHint rdfNoFieldHint">
                            <div id="itemPlaceholder" runat="server">
                            </div>
                            <div style="display:none">
                                <telerik:RadCalendar ID="rdfSharedCalendar" runat="server" RangeMinDate="<%#new DateTime(1900, 1, 1) %>"  />
                            </div>
                            <div style="display:none">
                                <telerik:RadTimeView ID="rdfSharedTimeView" runat="server"  />
                            </div>
                        </div>
                    </LayoutTemplate>
                    <ItemTemplate>
                        <fieldset class="rdfFieldset rdfBorders">
                            <legend class="rdfLegend">Détail</legend>
                            <div class="rdfRow">
                                <asp:Label ID="TypeIDLabel2" runat="server" CssClass="rdfLabel" Text="TypeID"></asp:Label>
                                <telerik:RadComboBox ID="TypeIDComboBox" runat="server" DataSourceID="EntityDataSource3" DataTextField="Description" DataValueField="ID" SelectedValue='<%# Eval("TypeID")%>' Enabled="false"></telerik:RadComboBox>
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="TitreLabel2" runat="server" CssClass="rdfLabel" Text="Titre"></asp:Label>
                                <asp:Label ID="TitreLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("Titre") %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DatePublicationLabel2" runat="server" CssClass="rdfLabel" Text="DatePublication"></asp:Label>
                                <asp:Label ID="DatePublicationLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("DatePublication") %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DateCreationLabel2" runat="server" CssClass="rdfLabel" Text="DateCreation"></asp:Label>
                                <asp:Label ID="DateCreationLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("DateCreation") %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DescriptionCourteLabel2" runat="server" CssClass="rdfLabel" Text="DescriptionCourte"></asp:Label>
                                <asp:Label ID="DescriptionCourteLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("DescriptionCourte") %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DescriptionLongueLabel2" runat="server" CssClass="rdfLabel" Text="DescriptionLongue"></asp:Label>
                                <asp:Label ID="DescriptionLongueLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("DescriptionLongue") %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="CreateurLabel2" runat="server" CssClass="rdfLabel" Text="Createur"></asp:Label>
                                <asp:Label ID="CreateurLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("Createur") %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="ImageFilenameLabel2" runat="server" CssClass="rdfLabel" Text="ImageFilename"></asp:Label>
                                <asp:Label ID="ImageFilenameLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("ImageFilename") %>' />
                            </div>
                            <div class="rdfCommandButtons">
                                <hr class="rdfHr" />
                                <telerik:RadButton ID="InitInsertButton" runat="server" ButtonType="SkinnedButton" CausesValidation="False" CommandName="InitInsert" Text="Insert" ToolTip="Nouveau" />
                                <telerik:RadButton ID="EditButton" runat="server" ButtonType="SkinnedButton" CausesValidation="False" CommandName="Edit" Text="Modifier" ToolTip="Modifier" />
                            </div>
                        </fieldset>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <fieldset class="rdfFieldset rdfBorders">
                            <legend class="rdfLegend">Edit</legend>
                            <div class="rdfRow">
                                <asp:Label ID="IDLabel2" runat="server" CssClass="rdfLabel" Text="ID"></asp:Label>
                                <asp:Label ID="IDLabel1" runat="server" CssClass="rdfFieldValue" Text='<%# Eval("ID") %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="TypeIDLabel2" runat="server" AssociatedControlID="TypeIDComboBox" CssClass="rdfLabel" Text="TypeID"></asp:Label>
                                <telerik:RadComboBox ID="TypeIDComboBox" runat="server" DataSourceID="EntityDataSource3" DataTextField="Description" DataValueField="ID" SelectedValue='<%# Bind("TypeID")%>'
                                    AutoPostBack="true" OnSelectedIndexChanged="TypeIDComboBox_SelectedIndexChanged1" ></telerik:RadComboBox>
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="TitreLabel2" runat="server" AssociatedControlID="TitreTextBox" CssClass="rdfLabel" Text="Titre"></asp:Label>
                                <telerik:RadTextBox ID="TitreTextBox" runat="server" Text='<%# Bind("Titre") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DatePublicationLabel2" runat="server" AssociatedControlID="DatePublicationTextBox" CssClass="rdfLabel" Text="DatePublication"></asp:Label>
                                <telerik:RadDateTimePicker ID="DatePublicationTextBox" runat="server" CssClass="rdfPicker" DbSelectedDate='<%# Bind("DatePublication") %>' MinDate="<%#new DateTime(1900, 1, 1) %>" SharedCalendarID='<%# Container.OwnerDataForm.FindControl("rdfSharedCalendar").UniqueID %>' SharedTimeViewID='<%# Container.OwnerDataForm.FindControl("rdfSharedTimeView").UniqueID %>' />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DateCreationLabel2" runat="server" AssociatedControlID="DateCreationTextBox" CssClass="rdfLabel" Text="DateCreation"></asp:Label>
                                <telerik:RadDateTimePicker ID="DateCreationTextBox" runat="server" CssClass="rdfPicker" DbSelectedDate='<%# Bind("DateCreation") %>' MinDate="<%#new DateTime(1900, 1, 1) %>" SharedCalendarID='<%# Container.OwnerDataForm.FindControl("rdfSharedCalendar").UniqueID %>' SharedTimeViewID='<%# Container.OwnerDataForm.FindControl("rdfSharedTimeView").UniqueID %>'/>
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DescriptionCourteLabel2" runat="server" AssociatedControlID="DescriptionCourteTextBox" CssClass="rdfLabel" Text="DescriptionCourte"></asp:Label>
                                <telerik:RadTextBox ID="DescriptionCourteTextBox" runat="server" Text='<%# Bind("DescriptionCourte") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DescriptionLongueLabel2" runat="server" AssociatedControlID="DescriptionLongueTextBox" CssClass="rdfLabel" Text="DescriptionLongue"></asp:Label>
                                <telerik:RadTextBox ID="DescriptionLongueTextBox" runat="server" Text='<%# Bind("DescriptionLongue") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="CreateurLabel2" runat="server" AssociatedControlID="CreateurTextBox" CssClass="rdfLabel" Text="Createur"></asp:Label>
                                <telerik:RadTextBox ID="CreateurTextBox" runat="server" Text='<%# Bind("Createur") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="ImageFilenameLabel2" runat="server" AssociatedControlID="ImageFilenameTextBox" CssClass="rdfLabel" Text="ImageFilename"></asp:Label>
                                <telerik:RadTextBox ID="ImageFilenameTextBox" runat="server" Text='<%# Bind("ImageFilename") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfCommandButtons">
                                <hr class="rdfHr" />
                                <telerik:RadButton ID="UpdateButton" runat="server" ButtonType="SkinnedButton" CommandName="Update" Text="Enregistrer" ToolTip="Enregistrer" />
                                <telerik:RadButton ID="CancelButton" runat="server" ButtonType="SkinnedButton" CausesValidation="False" CommandName="Cancel" Text="Canceller" ToolTip="Canceller" />
                            </div>
                        </fieldset>
                    </EditItemTemplate>
                    <InsertItemTemplate>
                        <fieldset class="rdfFieldset rdfBorders">
                            <legend class="rdfLegend">Insert</legend>
                            <div class="rdfRow">
                                <asp:Label ID="TypeIDLabel2" runat="server" AssociatedControlID="TypeIDComboBox" CssClass="rdfLabel" Text="TypeID"></asp:Label>
                                <telerik:RadComboBox ID="TypeIDComboBox" runat="server" DataSourceID="EntityDataSource3" DataTextField="Description" OnSelectedIndexChanged="TypeIDComboBox_SelectedIndexChanged"
                                    DataValueField="ID" SelectedValue='<%# Bind("TypeID")%>' AutoPostBack="true"></telerik:RadComboBox>
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="TitreLabel2" runat="server" AssociatedControlID="TitreTextBox" CssClass="rdfLabel" Text="Titre"></asp:Label>
                                <telerik:RadTextBox ID="TitreTextBox" runat="server" Text='<%# Bind("Titre") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DatePublicationLabel2" runat="server" AssociatedControlID="DatePublicationTextBox" CssClass="rdfLabel" Text="DatePublication"></asp:Label>
                                <telerik:RadDateTimePicker ID="DatePublicationTextBox" runat="server" CssClass="rdfPicker" DbSelectedDate='<%# Bind("DatePublication") %>' MinDate="<%#new DateTime(1900, 1, 1) %>" SharedCalendarID='<%# Container.OwnerDataForm.FindControl("rdfSharedCalendar").UniqueID %>' SharedTimeViewID='<%# Container.OwnerDataForm.FindControl("rdfSharedTimeView").UniqueID %>'  />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DateCreationLabel2" runat="server" AssociatedControlID="DateCreationTextBox" CssClass="rdfLabel" Text="DateCreation"></asp:Label>
                                <telerik:RadDateTimePicker ID="DateCreationTextBox" runat="server" CssClass="rdfPicker" DbSelectedDate='<%# Bind("DateCreation") %>' MinDate="<%#new DateTime(1900, 1, 1) %>" SharedCalendarID='<%# Container.OwnerDataForm.FindControl("rdfSharedCalendar").UniqueID %>' SharedTimeViewID='<%# Container.OwnerDataForm.FindControl("rdfSharedTimeView").UniqueID %>'  />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DescriptionCourteLabel2" runat="server" AssociatedControlID="DescriptionCourteTextBox" CssClass="rdfLabel" Text="DescriptionCourte"></asp:Label>
                                <telerik:RadTextBox ID="DescriptionCourteTextBox" runat="server" Text='<%# Bind("DescriptionCourte") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="DescriptionLongueLabel2" runat="server" AssociatedControlID="DescriptionLongueTextBox" CssClass="rdfLabel" Text="DescriptionLongue"></asp:Label>
                                <telerik:RadTextBox ID="DescriptionLongueTextBox" runat="server" Text='<%# Bind("DescriptionLongue") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="CreateurLabel2" runat="server" AssociatedControlID="CreateurTextBox" CssClass="rdfLabel" Text="Createur"></asp:Label>
                                <telerik:RadTextBox ID="CreateurTextBox" runat="server" Text='<%# Bind("Createur") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfRow">
                                <asp:Label ID="ImageFilenameLabel2" runat="server" AssociatedControlID="ImageFilenameTextBox" CssClass="rdfLabel" Text="ImageFilename"></asp:Label>
                                <telerik:RadTextBox ID="ImageFilenameTextBox" runat="server" Text='<%# Bind("ImageFilename") %>' WrapperCssClass="rdfInput" />
                            </div>
                            <div class="rdfCommandButtons">
                                <hr class="rdfHr" />
                                <telerik:RadButton ID="PerformInsertButton" runat="server" ButtonType="SkinnedButton" CommandName="PerformInsert" Text="Insérer" ToolTip="Insérer" />
                                <telerik:RadButton ID="CancelButton" runat="server" ButtonType="SkinnedButton" CausesValidation="False" CommandName="Cancel" Text="Canceller" ToolTip="Canceller" />
                            </div>
                        </fieldset>
                    </InsertItemTemplate>
                    <EmptyDataTemplate>
                        <div class="RadDataForm RadDataForm_<%# Container.Skin %>">
                            <div class="rdfEmpty">
                                There are no items to be displayed.</div>
                        </div>
                    </EmptyDataTemplate>
                </telerik:RadDataForm>
                </telerik:RadAjaxPanel>
                
            </asp:Panel>
        </div>
            <div id="previewPane" style="float:left;width:500px">
                <fieldset>
                    <legend >Apperçu</legend>
                    <div>
                        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" SelectedIndex="1">
                            <Tabs>
                                <telerik:RadTab runat="server" Text="Divers">
                                </telerik:RadTab>
                                <telerik:RadTab runat="server" Text="Secondaire" Selected="True">
                                </telerik:RadTab>
                                <telerik:RadTab runat="server" Text="Principale">
                                </telerik:RadTab>
                            </Tabs>
                        </telerik:RadTabStrip>
                    </div>
                </fieldset>
            </div>
            <div style="clear:both;"></div>
            <div id="grid">
                <asp:Panel ID="gridPanel" runat="server" >
                <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="EntityDataSource1" AllowSorting="true" OnSelectedIndexChanged="RadGrid1_SelectedIndexChanged">
                    <MasterTableView AutoGenerateColumns="False" DataSourceID="EntityDataSource1" DataKeyNames="ID">
                        <Columns>
                            <telerik:GridBoundColumn DataField="ID" DataType="System.Int32"  HeaderText="ID" Display="true" UniqueName="ID">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="TypeID" DataType="System.Int32" FilterControlAltText="Filter TypeID column" HeaderText="Type"  SortExpression="TypeID" UniqueName="TypeID">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="Titre" FilterControlAltText="Filter Titre column" HeaderText="Titre"  SortExpression="Titre" UniqueName="Titre">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="DescriptionCourte" FilterControlAltText="Filter DescriptionCourte column" HeaderText="Description Courte"  SortExpression="DescriptionCourte" UniqueName="DescriptionCourte">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="ImageFilename" FilterControlAltText="Filter ImageFilename column" HeaderText="Image URL"  SortExpression="ImageFilename" UniqueName="ImageFilename">
                            </telerik:GridBoundColumn>
                        </Columns>
                    </MasterTableView>
                    <ClientSettings EnablePostBackOnRowClick="true" Selecting-AllowRowSelect="true" >
                    </ClientSettings>
                </telerik:RadGrid>
                </asp:Panel>
            </div>
        <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel2" ></telerik:RadAjaxLoadingPanel>
     
        <asp:EntityDataSource ID="EntityDataSource1" runat="server" ConnectionString="name=RopackNewsEntities" DefaultContainerName="RopackNewsEntities"
            EnableFlattening="False" OrderBy="it.[ID]" EntitySetName="NewsData"
            Select="it.[ID],it.[TypeID], it.[Titre], it.[DescriptionCourte], it.[ImageFilename]"></asp:EntityDataSource>
     
        <asp:EntityDataSource ID="EntityDataSource3" runat="server" ConnectionString="name=RopackNewsEntities" DefaultContainerName="RopackNewsEntities"
            EnableFlattening="False" OrderBy="it.[ID]" EntitySetName="NewsType"> </asp:EntityDataSource>
     
        <asp:EntityDataSource runat="server" ID="EntityDataSource2" ConnectionString="name=RopackNewsEntities" DefaultContainerName="RopackNewsEntities"
            EnableFlattening="False" EntitySetName="NewsData"
            OrderBy="it.[ID]"
            Where="it.[ID]=@myID"
            EnableUpdate="True" EntityTypeFilter="NewsData" EnableInsert="true">
            <WhereParameters>
                <asp:ControlParameter ControlID="RadGrid1" Name="myID" PropertyName="SelectedValue" Type="Int32" />
            </WhereParameters>
            <UpdateParameters>
                <asp:Parameter Name="TypeID" Type="Int32" />
                <asp:Parameter Name="Titre" Type="String" />
            </UpdateParameters>
        </asp:EntityDataSource>

    On the SelectedIndexChanged of my combobox, I'm trying to get the DataItem and change some data (just for the purpose of testing im not even checking the new value of the comboxbox),
    but the result is that my dataform is not updated.
    I know I'm missing some key concept but I couldn't find my mistake.

    protected void TypeIDComboBox_SelectedIndexChanged1(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
        {
            RadDataForm1.Rebind();
            NewsData test = (NewsData)RadDataForm1.Items[0].DataItem;
             test.Titre = "naissance";
         /**** Something is missing here!!!! I guess!!! *****/
        }

    Any helps would be appreciated to acheive my scenario

    Thank you.
  2. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1796 posts

    Posted 22 Dec 2014 Link to this post

    Hello Simon,

    Within the OnSelectedIndexChanged event handler of the RadComboBox you could get reference to the NamingContainer of the RadComboBox, which will be the RadDataFormEditableItem. Once you have reference to the editable item you can find the controls to which you need to change the values.

    Following is a simple example demonstrating that approach:
    protected void TypeIDComboBox_SelectedIndexChanged1(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
    {
        RadDataFormEditableItem editItem = (sender as RadComboBox).NamingContainer as RadDataFormEditableItem;
        RadTextBox titreTextBox = editItem.FindControl("TitreTextBox") as RadTextBox;
        titreTextBox.Text = "naissance";
            .....
    }

    Hope this helps.


    Regards,
    Konstantin Dikov
    Telerik
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Simon
    Simon avatar
    12 posts
    Member since:
    Nov 2014

    Posted 22 Dec 2014 in reply to Konstantin Dikov Link to this post

    Hi Konstantin,
         it did the trick. I would never tough about this.

    Thank you!!!
Back to Top