Hi I'm building my first MVC 2 app and I'm really confused by all the examples I'm reading. I am also using the Telerik MVC kit for their Grid, and other such controls.
I've read many tutorials and watched videos but I can't quite grasp the pattern of where to place javascript and how to wrap blocks of code in the appropriate tags. For example I am trying to follow the task of associating a Client with a State via a DropDownList of states (AZ, CA, etc..):
My ClientController looks like this:
void PopulateStates()
{
var tempRepo = RepositoryFactory.CreateRepostiory<State>(RepositoryType.Business);
var states = tempRepo.QueryAll().ToList();
var svmList = states.Select(s => Mapper.Map<State, StateViewModel>(s));
ViewData["States"] = svmList;
}
public ActionResult Index()
{
PopulateStates();
return View();
}
Index.aspx looks like this:
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<% Html.RenderPartial("ClientGrid"); %>
</asp:Content>
ClientGrid.ascx looks like this:
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>
<%= Html.Telerik().Grid<ViewModels.ClientViewModel>()
.Name("ClientGrid")
.EnableCustomBinding(true)
.DataKeys(keys =>
{
keys.Add(c => c.Id);
})
.ToolBar(commands => commands.Insert().ButtonType(GridButtonType.Text))
.DataBinding(dataBinding =>
{
dataBinding.Ajax()
.Select("_Select", "Clients", new Telerik.Web.Mvc.GridState())
.Insert("_Insert", "Clients", new Telerik.Web.Mvc.GridState())
.Update("_Save", "Clients", new Telerik.Web.Mvc.GridState())
.Delete("_Delete", "Clients", new Telerik.Web.Mvc.GridState());
})
.Columns(columns =>
{
columns.Bound(c => c.Id);
...
And the ClientViewModel.ascx:
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<ViewModels.ClientViewModel>" %>
<table>
<tr>
<td>
<div class="editor-label">
<%: Html.LabelFor(model => model.StateName) %>
</div>
<div class="editor-field">
<%: Html.EditorFor(model => model.State) %>
<%: Html.ValidationMessageFor(model => model.State) %>
</div>
</td>
</tr>
</table>
And finally the editor template /Shared/EditorTemplates/StateViewModel.ascx
:
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<ViewModels.StateViewModel>" %>
<%=
Html.Telerik().DropDownList()
.Name("DropDownList")
.BindTo
(
((IEnumerable<ViewModels.StateViewModel>)ViewData["States"])
.Where(s => s.StateType == "State")
.Select(s => new SelectListItem
{
Text = s.FormattedName,
Value = s.Id.ToString(),
Selected = (Model != null) ? (Model.Id == s.Id) : false
})
)
%>
In general, I don't understand which portion ends up at the client and which portion ends up compiled at the server. I'm also very confused by the different notations for lambdas and/or registering events.
The lambda stuff is killing me. I spend a ton of time just trying to figure out when to use new {}
and () =>
....
- Where does javascript go in these 3 files, and do I need special tags for it?
- Where do I use
<%
tag versus<%=
and<%:
? - Why is it that sometimes inside
<%
it asks to terminate with semicolon likeMyFunction();
and other times it's justMyFunction()
?
Thank you!