ASP.NET MVC 2对Javascript感到困惑

时间:2010-09-30 03:38:41

标签: javascript jquery asp.net-mvc-2 asp.net-ajax

您好我正在构建我的第一个MVC 2应用程序,我真的很困惑我正在阅读的所有示例。我也使用Telerik MVC工具包作为他们的网格和其他此类控件。

我已经阅读了很多教程和观看视频,但我无法完全掌握javascript的放置模式以及如何在适当的标签中包装代码块。例如,我正在尝试通过DropDownList状态(AZ,CA等)关联客户端与状态的任务:

我的ClientController看起来像这样:

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看起来像这样:

<%@ 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如下所示:

<%@ 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);
            ...

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>

最后是编辑器模板/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
        })
    )
%>

一般情况下,我不明白哪个部分最终在客户端,哪个部分最终在服务器上编译。我也对lambda和/或注册事件的不同符号感到困惑。

lambda的东西正在杀了我。我花了很多时间试图找出何时使用new {}() => ....

  1. javascript在这三个文件中的位置,我需要特殊的标签吗?
  2. 我在哪里使用<%代码与<%=<%:
  3. 为什么有时会在<%内部要求以MyFunction();之类的分号结束,有时候它只是MyFunction()
  4. 谢谢!

1 个答案:

答案 0 :(得分:0)

Javascript几乎可以在任何地方使用,但最好将它放在主页的<head>标记中。在您的子页面中,您可以添加<content>标记,该标记会将特定于您网页的javascript放置在母版页的相应位置。

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<asp:Content ID="Content2" ContentPlaceHolderID="HeadContent" runat="server">
    //javascript goes here in <script> tags
</asp:Content>

<% vs <%: vs <%=

<%用于调用服务器上的某个函数,并执行一些将数据输出到客户端的处理。 <%:用于将使用html编码的字符串输出到客户端 - 这对于输出用户可能已键入的内容非常有用,因为它们可能包含自己的<script>标记,因此当您输出它时请参阅源代码中的&lt;script&gt;,它不会被解析为脚本 <%=用于输出字符串,但 html对字符串进行编码

仅当您不输出到客户端时才使用分号。 (虽然一些罕见的函数可能仍会输出,但它们会在内部输出而不是返回字符串或mvcstring。因此,每当您使用<% %>时,最后都会添加;