This is a migrated thread and some comments may be shown as answers.

tabstrip form and grid

0 Answers 37 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
raphael
Top achievements
Rank 1
raphael asked on 20 Jun 2012, 07:20 AM

Hi I'd to know if it's possible to do the following thing.

I have a tabstrip, on the first tab page I have some info, and on the second page I have a grid with all the details. that look like this:

Html.Telerik().TabStrip()
        .Name("TabStrip")
        .Items(tabstrip =>
        {
            tabstrip.Add()
                .Text("Base")
                .Content(@<text>
                    <fieldset>
                        @Html.HiddenFor(model => model.Id)
                        <div class="editor-label">
                            @Html.LabelFor(model => model.LastName)
                        </div>
                        <div class="editor-field">
                            @Html.EditorFor(model => model.LastName)
                            @Html.ValidationMessageFor(model => model.LastName)
                        </div>
                        <div class="editor-label">
                            @Html.LabelFor(model => model.FirstName)
                        </div>
                        <div class="editor-field">
                            @Html.EditorFor(model => model.FirstName)
                            @Html.ValidationMessageFor(model => model.FirstName)
                        </div>
                    </fieldset>
                </text>);
            tabstrip.Add()
                        .Text("Details")
                        .Content(@<text>
                            @RenderGrid(Model)
                        </text>);
        })
        .SelectedIndex(0)
        .Render();    
  
@helper RenderGrid(DetailModel model)
{
    @(Html.Telerik().Grid(model.Details)
        .Name("detailGrid")
        .DataKeys(k => k.Add(r => r.Id))
        .ToolBar(commands => commands.Insert().ButtonType(GridButtonType.BareImage).ImageHtmlAttributes(new { style = "margin-left:0" }))
        .Columns(columns =>
        {
            columns.Bound(bp => bp.field1).Width(90);
            columns.Bound(bp => bp.field2).Width(160);
            columns.Bound(bp => bp.field3).Width(160);
            columns.Command(commands =>
            {
                commands.Edit().ButtonType(GridButtonType.BareImage);
                commands.Delete().ButtonType(GridButtonType.BareImage);
            }
                );
        })
        .DataBinding(dataBinding => dataBinding.Ajax()
                        .Select("Index", "controller")
                        .Insert("Insert", "controller")
                        .Update("Update", "controller")
                        .Delete("Delete", "controller"))
        .Editable(editing => editing.Mode(GridEditMode.PopUp))
}

What I'd like to achieve is to compile my base info and all details, and after that save send back the entire model and save my base info and all the details, is this possible? and if yes can you show me an example?
Or do I have to first insert my base info, than go to the grid and insert all details one after the other and save one at time?

thank you very much

Raphael
If what I'm looking
Tags
TabStrip
Asked by
raphael
Top achievements
Rank 1
Share this question
or