分离C#和HTML的最佳方法

时间:2012-09-07 09:34:42

标签: c# asp.net structure

我一直在与ASP.NET项目团队合作,这是一个项目管理工具。 大多数页面基本上都是将数据库中的内容写入页面并存储所做的更改。

这是我们在ASP.NET中的第一个项目(我们目前在所有其他项目中使用ASP Classic),我们的大四学生告诉我们不要使用MVC。

现在的问题是,如果涉及ASP.NET,我们的Designer /前端开发人员几乎一无所知,他也不想使用VisualStudio(他使用OSX)。

例如: 例如,编写动态列表的最佳方法是什么?

这就是我们目前所做的事情:

<div id="tasks" overflow-y="scroll" style="height:400px;">
   <ul id='taskList'>
     <% PrintTasks(); %>
   </ul>
</div>

在代码隐藏中:

public void PrintTasks()
{
        foreach (var task in _tasks)
        {
            Response.Write("<li rel='#' id='task_"+task.TaskID+"'>" +
                   ...
                "</span>" +
                "</li>");
        } 
}

在这种情况下,设计人员无法编辑li标签而无需进入后面的代码。

感谢。

6 个答案:

答案 0 :(得分:2)

我担心你的前端开发人员不得不吮吸它并学习如何使用VS.如果整个团队都在使用ASP.Net,那么就无法摆脱VS的愤怒。

MVC非常适合分离C#和HTML。 Razor引擎提供了一种分离代码和标记的好方法。

对于你的名单,你可能会在Razor中做类似的事情:

@foreach (var item in items)
{
    <li rel="#" id ="blah_@item.id">@item.text</li>
}

答案 1 :(得分:2)

你绝对应该提出为什么MVC不是一个选项的问题。它将更适合您正在做的事情,因此代码质量也会更好,这有助于整个项目。更不用说团队生产力(以及设计师“逃避”VS的能力)。

使用Razor做一些CSHTML,你和你的团队几乎会感到“在家”。

答案 2 :(得分:1)

根据您的情况,主要的摩擦点是您的前端开发者。

所以,决定使用javascript框架(Knockout.js,angular.js,等等)。 让您的前端开发人员设计UI,从您选择的Web堆栈(ASP.NET MVC,Web Api,等等)提供的JSON中获取所有需要的信息。 这将确保他可以使用他想要的工具开发他的UI。而且您可以在后端工作而无需担心UI。你只需要就JSON合同达成一致并坚持下去。

通过这种方式,您可以将关注点清晰地分开: - 每个人都使用他们最轻松的工具进行开发 - 没有层混合和匹配(即在您的代码中生成一些HTML&#34;生成&#34;)

并且,您的列表看起来像(使用淘汰赛)(语法可能不准确):

<ul data-bind="foreach: myList">
    <li><span data-bind="text: Text, attr: { id: Id }" /></li>
</ul>

代码落后(使用asp.net mvc)(语法可能不准确)

public JsonResult GetList()
{
    var res =  myServiceLayer
        .GetListItems()
        .Select( 
            x => new { Text = x.Val, Id = x.Id } 
        );
    return JsonResult( res );
}

答案 3 :(得分:1)

使用ASP.NET WebForms时,我会给你以下建议:

  1. 利用CSS。接受您的设计人员无法编辑代码隐藏所产生的HTML,但如果您智能地使用CSS,则可以克服这一挑战。在您的示例中,您有一个带有id的divul元素,然后设计人员可以使用CSS的级联属性更改CSS以设置这些元素和子元素的样式。 (例如:#taskList > li
  2. 在适当的时候考虑客户端模板。在为用户呈现数据时,fx。列表,考虑使用模板框架。 (jQuery fx)这些模板可以放在单独的文件中,设计人员可以在没有VS的情况下进行编辑。 (参考:load jQuery-Templates from external file?
  3. 花一些时间学习ASP.NET WebForms中可用的不同控件,而不是使用Response.Write来构建HTML。在代码隐藏中使用Response.Write通常是一种非常糟糕的做法,应该避免使用,因为你的代码会迅速变成意大利面并且不可维护。如果您希望在以后的项目中使用ASP.NET WebForms(或MVC)并希望您的高级管理人员能够看到ASP.NET的优势,那么您和您的团队应该花一点时间学习该框架。当您这样做时,您将获得更易于维护的结构化代码。但是,如果您在ASP.NET中使用当前的经典ASP实践,那么您的高级管理人员或管理人员都不会看到使用ASP.NET的好处。这将是一种耻辱,因为它的好处确实存在。 : - )
  4. 祝你好运!

答案 4 :(得分:0)

在您提到的特定情况下,在'经典'asp.net中,您应该使用转发器:http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.repeater(v=vs.80).aspx

<asp:Repeater id="Repeater1" runat="server">                       
    <ItemTemplate>
        <li rel='#' id='task_<%# DataBinder.Eval(Container.DataItem, "TaskID") %>'>
            <span>Whatever</span>
        </li>
      </ItemTemplate>            
 </asp:Repeater>

基本上,了解哪些web控件可用,每次必要时创建新的web控件,并尝试从asp.net webform的有限绑定/模板系统中尽可能多地获取。

答案 5 :(得分:0)

在这里使用Repeater:

<asp:Repeater runat="server" ID="r1">
<ItemTemplate>
  <li rel='#' id='<%# Eval("id","prefix{0}") %>'><span>
     <asp:Label runat="server" ID="t1"><%# Eval("Caption") %></asp:Label>
  </span></li>
</ItemTemplate>
</asp:Repeater>

并在cs文件中:

r1.DataSource=list;
r1.DataBind();