How to get CellTemplate (Edit and Delete Buttons) and CellEditTemplate (Save and Cancel Buttons) to show correctly and then fire off service calls?

4 posts, 0 answers
  1. Scott
    Scott avatar
    16 posts
    Member since:
    Oct 2013

    Posted 14 Mar 2014 Link to this post

    First off, I'm using Silverlight 4 (company requirement, can't upgrade to 5).

    I have a GridView that has 2 data columns called (Name and Data) and then 1 regular column for modification buttons, (Edit and Delete) and (Save and Cancel), where 1 set of buttons is shown by Default and the other by Edit Mode.

    My GridView's ItemsSource is an ObservableCollection that contains objects that have the Name and Data properties.  This collection is pulled via a WCF service call that executes a Get stored procedure on our SQL Server.  I also have other stored procedures that will Add, Edit, or Delete a record.

    I am trying to accomplish what I believe should be a very simple or basic task: 

    I want to be able to Add, Edit, or Delete a record that would, in real time, fire off a WCF service call to execute the corresponding Add, Edit, or Delete stored procedure on our SQL Server.

    My first issue is that I can't even get the CellTemplate and CellEditTemplate to show correctly.  I don't want to throw the row into Edit Mode based on a row or cell selection; I want to force the user to click the Edit button.  That should then trigger the Edit Mode so that the Save and Cancel buttons of the CellEditTemplate should show along with the Name and Data columns both becoming TextBoxes.  

    At that point, clicking the Save button would update the object in the collection and then fire off a WCF service call to the Edit stored procedure.  Likewise, if the user clicks the "Click here to add new item" row, it would do just like before, but instead of the firing off a call to the Edit stored procedure, it would fire off a call to the Add stored procedure.

    My GridView is defined as:

    <telerik:RadGridView
      Grid.Row="8"
      Grid.Column="2"
      x:Name="KeyValuesGridView"
      ActionOnLostFocus="None"
      AlternateRowStyle="{StaticResource rgvAlternateRowStyle}"
      AlternationCount="2"
      AutoGenerateColumns="False"
      Background="DarkGray"
      BorderBrush="Black"
      BorderThickness="2"
      CanUserDeleteRows="True"
      CanUserFreezeColumns="False"
      CanUserInsertRows="True"
      CanUserReorderColumns="False"
      Foreground="Black"
      GridLinesVisibility="Both"
      HorizontalAlignment="Stretch"
      IsFilteringAllowed="False"
      IsReadOnly="False"
      NewRowStyle="{StaticResource rgvNewRowStyle}"
      RowIndicatorVisibility="Collapsed"
      RowStyle="{StaticResource rgvRowStyle}"
      ScrollMode="RealTime"
      SelectionMode="Single"
      ShowGroupFooters="False"
      ShowGroupPanel="False"
      ShowInsertRow="True">

    My Name and Data columns are defined as:

    <telerik:GridViewDataColumn
      DataMemberBinding="{Binding Name}"
      Header="Name"
      HeaderCellStyle="{StaticResource rgvHeaderCellStyle}"
      CellStyle="{StaticResource rgvCellStyle}"
      Width="Auto" />
     
    <telerik:GridViewDataColumn
      DataMemberBinding="{Binding Data}"
      Header="Data"
      HeaderCellStyle="{StaticResource rgvHeaderCellStyle}"
      CellStyle="{StaticResource rgvCellStyle}"
      Width="*" />

    My modification buttons column is defined as:

    <telerik:GridViewColumn
      Width="Auto"
      IsResizable="False">
     
      <telerik:GridViewColumn.CellTemplate>
        <DataTemplate>
     
          <StackPanel
            Orientation="Horizontal"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Stretch">
     
            <telerik:RadButton
              Content="Edit"
              Command="telerikGrid:RadGridViewCommands.Edit"
              CommandParameter="{Binding}"
              Style="{StaticResource BlueButton}" />
     
            <telerik:RadButton
              Content="Delete"
              Command="telerikGrid:RadGridViewCommands.Delete"
              CommandParameter="{Binding}"
              Style="{StaticResource BlueButton}" />
     
          </StackPanel>
     
        </DataTemplate>
      </telerik:GridViewColumn.CellTemplate>
     
      <telerik:GridViewColumn.CellEditTemplate>
        <DataTemplate>
     
          <StackPanel
            Orientation="Horizontal"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Stretch">
     
            <telerik:RadButton
              Content="Save"
              Command="telerikGrid:RadGridViewCommands.Save"
              CommandParameter="{Binding}"
              Style="{StaticResource BlueButton}" />
     
            <telerik:RadButton
              Content="Cancel"
              Command="telerikGrid:RadGridViewCommands.Cancel"
              CommandParameter="{Binding}"
              Margin="10,0,0,0"
              Style="{StaticResource BlueButton}" />
     
          </StackPanel>
     
        </DataTemplate>
      </telerik:GridViewColumn.CellEditTemplate>
     
    </telerik:GridViewColumn>
  2. Scott
    Scott avatar
    16 posts
    Member since:
    Oct 2013

    Posted 18 Mar 2014 in reply to Scott Link to this post

    I'm kind of in a time crunch here. This was posted ~4 days ago.  No response at all?
  3. DevCraft banner
  4. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 19 Mar 2014 Link to this post

    Hi Scott,

    Firstly, let me clarify a bit the scenario you want to accomplish:
    1. You want to have Edit and Delete buttons in view mode and Save and Cancel in edit mode. 
    2. You want to be able to edit an item only by pressing Edit button.

    If my understanding is correct:
    1. You cannot have the first column with the buttons in edit mode, while another column is edited as well. RadGridView supports only a single cell editing. If you want the buttons Save and Cancel to be available while modifying other values, you can try creating CellTemplateSelector, expose a new property - IsEditing for example and depending on it, to display "Edit and Delete" template or "Save and Cancel". Please take a look at our documentation about CellTemplateSelector and its corresponding demo.
    2. You can set EditTriggers property of the grid to None. 

    Let me know in case you need further assistance with the implementation.


    Regards,
    Maya
    Telerik
     

    DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

     
  5. Scott
    Scott avatar
    16 posts
    Member since:
    Oct 2013

    Posted 19 Mar 2014 in reply to Maya Link to this post

    Thanks for clearing that up about the the single cell editing. I'll take a look at the CellTemplateSelector and report back.
Back to Top