locked
Customize appearance of textbox and other controls in the gridview and detailsview using DynamicData RRS feed

  • Question

  • User-1759624489 posted

     Hello.

     

    I need to customize the appearence of the textboxes inside the gridview and detailsview.

    I need to customize also the appearance of the buttons.

     

    Currently  I have the following.

     

    <asp:DetailsView ID="DetailsView1" runat="server"
                                DataSourceID="DetailsDataSource" DefaultMode="Insert"
                                OnItemDeleted="OnDetailsViewItemDeleted"
                                OnItemInserted="OnDetailsViewItemInserted"
                                OnItemUpdated="OnDetailsViewItemUpdated"
                                OnModeChanging="OnDetailsViewModeChanging" OnPreRender="OnDetailsViewPreRender"
                                style="text-align: center" DataKeyNames="Id">
                                <RowStyle CssClass="formRow" />
                                <Fields>
                                    <asp:CommandField NewText="Nuevo" ShowInsertButton="True" ButtonType="Button" />
                                </Fields>
                                <HeaderStyle CssClass="tableHead" />
                                <AlternatingRowStyle CssClass="formAlternateRow" />
                            </asp:DetailsView>

     

       <asp:GridView ID="GridView1" runat="server" AllowPaging="True"
                                AllowSorting="True" AutoGenerateColumns="False" DataSourceID="GridDataSource"
                                OnDataBound="OnGridViewDataBound" OnRowCreated="OnGridViewRowCreated"
                                OnRowDeleted="OnGridViewRowDeleted" OnRowEditing="OnGridViewRowEditing"
                                OnRowUpdated="OnGridViewRowUpdated"
                                OnSelectedIndexChanging="OnGridViewSelectedIndexChanging"
                                style="text-align: center; margin-right: 1px;">
                                <RowStyle CssClass="row" />
                                <Columns>
                                    <asp:DynamicField DataField="Id" />
                                    <asp:DynamicField DataField="Name" HeaderText="Nombre Regional" />
                                    <asp:CommandField ButtonType="Image" CancelText="Cancelar"
                                        DeleteImageUrl="~/App_Themes/SodexoTheme/ImageLibrary/icoDelete.png"
                                        DeleteText="Eliminar"
                                        EditImageUrl="~/App_Themes/SodexoTheme/ImageLibrary/icoEdit.png" EditText="Editar"
                                        InsertText="Insertar" NewText="Nuevo" SelectText="Seleccionar"
                                        ShowEditButton="True" UpdateText="Actualizar" />
                                                 
                                      <asp:TemplateField>
                                        <ItemTemplate>
                                            <asp:ImageButton  CommandName="Edit" CausesValidation="false" ID="EditButton" ImageUrl="~/App_Themes/SodexoTheme/ImageLibrary/icoEdit.png" runat="server" NavigateUrl='<%# table.GetActionPath(PageAction.Edit, GetDataItem()) %>'    Text="Editar" ToolTip="Editar"  />
                                            <asp:ImageButton  CommandName="Delete" CausesValidation="true" ID="DeleteButton1" ImageUrl="~/App_Themes/SodexoTheme/ImageLibrary/icoDelete.png" runat="server" NavigateUrl='<%# table.GetActionPath(PageAction.Edit, GetDataItem()) %>'    Text="Eliminar" ToolTip="Eliminar"  OnClientClick='return confirm("Are you sure you want to delete this item?");' />
                                        </ItemTemplate>
                                        <EditItemTemplate>
                                            <asp:ImageButton CommandName="Update" CausesValidation="true" ID="EditButton" ImageUrl="~/App_Themes/SodexoTheme/ImageLibrary/icoEdit.png" runat="server" NavigateUrl='<%# table.GetActionPath(PageAction.Edit, GetDataItem()) %>'    Text="Actualizar"  ToolTip="Actualizar"  />
                                            <asp:ImageButton CommandName="Cancel" CausesValidation="false" ID="DeleteButton1" ImageUrl="~/App_Themes/SodexoTheme/ImageLibrary/icoDelete.png" runat="server" NavigateUrl='<%# table.GetActionPath(PageAction.Edit, GetDataItem()) %>'    Text="Cancelar"  ToolTip="Cancelar" OnClientClick='return confirm("Are you sure you want to delete this item?");' />
                                        </EditItemTemplate>
                                    </asp:TemplateField>
                                   
                                     <asp:DynamicField DataField="Cities"  ShowHeader="false"/>
                                   
                                 
                                </Columns>
                                <HeaderStyle CssClass="tableHead" />
                                <PagerTemplate>
                                    <asp:GridViewPager runat="server" />
                                </PagerTemplate>
                                <EmptyDataTemplate>
                                    No se encuentran registros.
                                </EmptyDataTemplate>
                                <AlternatingRowStyle CssClass="alternateRow" />
                            </asp:GridView>

     

     

     

    Wednesday, September 3, 2008 3:12 PM

All replies

  • User-797310475 posted

    Could you clarify which elements you want to customize and how?

    You could start by applying CSS styles and modifying the field templates.

    Wednesday, September 3, 2008 4:06 PM
  • User660823006 posted

    This appears to be almost a duplicate of the other thread we had going on.My last post in the thread explained how Dynamic Data generates the fields for particular columns. There is a directory called DynamicData\FieldTemplates and in this directory are the templates used for showing, editing and inserting various types of data in Dynamic Data. If you want to modify these and have them change globally you can just modify the ones in the directory (to say add a ValidatorCallout). You can also create new versions of these and enable the by adding a UIHint attribute on your entity that species which field template you want to use. You can also manually in your pages override these by using a DynamicField in the field collection and specifying the UIHint on the DynamicField. You can read more about field templates in the documentation: http://msdn.microsoft.com/en-us/library/cc488523.aspx.

    Wednesday, September 3, 2008 4:08 PM
  • User-1759624489 posted

     I want to modify the textboxes for example.

     

    I see that they can be customized via  the text_edit control right? is there any other way? I mean inside  a templatefield or soemthing?

     

    thx

    Wednesday, September 3, 2008 4:18 PM
  • User-797310475 posted

    The field template controls can be customized where they are declared - inside the field template user control.

    You can pass additional parameters to the field templates by adding extra attributes to the DynamicField or DynamicControl controls. If the underlying field template declares properties that match the names fo the attributes, then the values of the properties will be set to be the values of the attributes. You can then use the values in the properties to further customize the UI inside of your field template.

    Wednesday, September 3, 2008 4:44 PM
  • User-1759624489 posted

    Thanks scott, you are the best.

    [:)] 

    Wednesday, September 3, 2008 5:17 PM