Ahmed
Ahmed

Reputation: 3

Telerik MVC3 grid with custom Edit/Insert popup

I'm new to MVC, and I was trying to create a page to list items, and I can Add/Edit items in this list.

I used telerik MVC grid to show the list of items, what I want now is to know is there a way to customize how the add/edit popup of the telerik grid.

The reason is that I need to hide some fields, and add some other lookups.

Thanks in advance.

Upvotes: 0

Views: 6672

Answers (2)

Mark Freedman
Mark Freedman

Reputation: 225

I wrote a detailed series on a master/detail AJAX-driven Telerik MVC grid, which makes use of an editor template in the detail grid's editor pop-up, and also hides some columns (getting around some issues with that). I discuss this in part 3, and you can download the full sample app. Hopefully that can help a bit.

Upvotes: 1

Daniel
Daniel

Reputation: 5732

You can create a custom Editor Template. In the folder EditorTemplates under Views/Shared, add a view that has the name of your model. When you use pop up editing, it will use the template you defined.

Telerik has an example project demonstrating how this is done: Custom PopUp Editor Form.

Here is the code for an Editor Template I made for a project where my model was Tasks:

@model Whiteboard.Models.Tasks

<fieldset>
    <legend>Tasks</legend>

    @Html.HiddenFor(c => c.TID)

    <div>
    <p>
        @Html.LabelFor(w => w.Task):<br />
        @Html.TextBoxFor(c => c.Task, new { style = "width: 375px;" })
    </p>
    </div>
    <div>
    <p>
        @Html.LabelFor(w => w.WDate):<br />
        @Html.EditorFor(c => c.WDate)
    </p>
    </div>
    <div>
    <p>
        @Html.LabelFor(w => w.Description):<br />
        @Html.TextAreaFor(c => c.Description, new { cols = "45", rows = "15", @class = "ext_TextArea" })
    </p>
    </div>
    <div>
    <p>
        @Html.LabelFor(w => w.Notes):<br />
        @Html.TextAreaFor(c => c.Notes, new { cols = "45", rows = "5", @class = "ext_TextArea" })
    </p>
    </div>
</fieldset>

Upvotes: 2

Related Questions