将c＃中的列表转换为javascript中的表格

我有一个带有剃须刀视图引擎的asp.net mvc应用程序。我需要使用javascript将c＃中的列表转换为javascript中的表格

@section logout { 
    <a href='@Url.Action("Retour", "Client")'><img src="~/Content/images/home-icon.png" /></a> 
    <a href='@Url.Action("Logout", "Home")' style="margin-left: 91.6%"><img src="~/Content/images/images.jpg" style="width:37px; height:37px" /></a> 
    } 
@Json.Encode(Model.Get_List_Tache()); 

<!DOCTYPE html> 
<html> 
<head> 

    <link rel="stylesheet" href="~/Content/jquery.treeview.css" /> 
    <script src="~/Content/jquery.cookie.js" type="text/javascript"></script> 
    <script src="~/Content/jquery.treeview.js" type="text/javascript"></script> 
    <script type="text/javascript" src="~/Content/demo.js"></script> 
    <!-- partie calendrier--> 
    <link rel="stylesheet" href="~/Scripts/Calendar/theme.css" /> 
    <link href="~/Scripts/Calendar/fullcalendar.css" rel="stylesheet" /> 
<link href="~/Scripts/Calendar/fullcalendar.print.css" rel="stylesheet" media="print" /> 
<script src="~/Scripts/Calendar/fullcalendar.min.js"></script> 


     <style> 
     body 
     { 
      background-color:#eee; 
     } 

     #tree { 
      background-color:#eee; 
     } 

     .affaire { 
      color:black; 
       font-size: 16px; 

     } 
     .tache { 
      color:black; 
       font-size: 12px; 
     } 
     .projet { 
      color:blue; 
       font-size: 20px; 
     } 
      .sequence { 
      color:blue; 
       font-size: 13px; 
     } 
      #calendar { 
     width: 700px; 
     margin: 0 auto; 
     } 
    </style> 

    <script> 

     $(document).ready(function() { 

      var date = new Date(); 
      var d = date.getDate(); 
      var m = date.getMonth(); 
      var y = date.getFullYear(); 
      var titles= Json.Parse(Model.Get_List_Tache()); 
      $('#calendar').fullCalendar({ 
       theme: true, 
       header: { 
        left: 'prev,next today', 
        center: 'title', 
        right: 'month,agendaWeek,agendaDay' 
       }, 
       editable: true, 


       events: [ 

         { 
       id: 999, 
      title: titles[0], 
      start: new Date(y, m, d - 3, 16, 0), 
      allDay: false 
     } 


     ] 
     }); 

     }); 

</script> 
</head> 
<body> 



     <table><tr><td style="width:200px;display:block;margin-top:80px;" id="tree"> 
      <ul id="red" style="width: 100%; display:block;width:100%;margin-top:0%"> 
       @for (int i = 0; i < Model.Get_List_Projet().Count; i++) 
       { 
    <li><span class="projet">Projet : @Model.Get_List_Projet()[@i].Description</span> 
     <br /> 
     <br /> 
     <ul> 
       @for (int j = 0; j < Model.Get_List_Affaire_By_Projet(Model.Get_List_Projet()[@i].Id_projet).Count; j++) 
       { 
      int id_affaire = @Model.Get_List_Affaire_By_Projet(Model.Get_List_Projet()[@i].Id_projet)[@j].Id_affaire; 
       <li><span class="affaire"> @Model.Get_List_Affaire_By_Projet(Model.Get_List_Projet()[@i].Id_projet)[@j].Affaire_description</span> 
       <br /> 
       <br /> 
       <ul> 

        @for (int k = 0; k < @Model.Get_List_Sequence_By_Affaire(id_affaire).Count; k++) 
         { 
          int id_sequence = @Model.Get_List_Sequence_By_Affaire(id_affaire)[k].Id_séquence; 

        <li><span class="sequence">@Model.Get_List_Sequence_By_Affaire(id_affaire)[k].Sequence_description </span> 

        <ul> 
          @for (int t = 0; t < @Model.Get_List_Tache_By_Sequence(id_sequence).Count; t++) 
         { 
          int id_tache = @Model.Get_List_Tache_By_Sequence(id_sequence)[t].Id_tache; 
         <li><span class="tache">Tache : @Html.ActionLink((string)@Model.Get_List_Tache_By_Sequence(id_sequence)[t].Tache_description, "GererTache", new { id = id_tache })</span></li> 
         } 
         <li>@Html.ActionLink("AjouterTache", "AjouterTache", new { id = id_affaire }) </li> 
         <li>@Html.ActionLink("GérerSéquence", "GererSequence", new { id = id_sequence }) </li> 
        </ul> 

        </li> 
         } 
        @for (int g = 0; g < @Model.Get_List_Tache_By_Affaire(id_affaire).Count; g++) 
         { 
          int id_task = @Model.Get_List_Tache_By_Affaire(id_affaire)[g].Id_tache; 
        <li><span class="tache">Tache: @Html.ActionLink((string)@Model.Get_List_Tache_By_Affaire(id_affaire)[g].Tache_description, "GererTache", new { id = id_task })</span> 

        </li> 
         } 
       </ul> 
       <ul><li>@Html.ActionLink("AjouterSéquence", "AjouterSéquence", new { id = id_affaire }) </li> 

        <li>@Html.ActionLink("AjouterTache", "AjouterTache", new { id = id_affaire }) </li> 
        <li>@Html.ActionLink("Gérer cette affaire", "GererAffaire", new { id = id_affaire }) </li> 
       </ul> 
       </li> 
    } 

     </ul> 
    </li> 
       }   


    <br /> 


       </ul> 

</td> <td > 
     <div id='calendar'></div> 
</td> 

      </tr> 
      </table> 
    <a href='@Url.Action("Choice", "Travail")'>Retour</a> 
    </body> 
</html>

为在我看来，一个模型通过列表的值存储，但我不知道我怎样才能从服务器端传递到客户端，从C#名单通过Javascript表。

所以我需要建议做这个任务

来源

2013-07-15 Lamloumi Afif

我不太清楚，我明白，对于服务器到Javascript，使用'@ this.Model.myVariable'和相反的，要么'$ .post'数据使用'JSON.stringify'或创建一个窗体隐藏字段，其中'name'属性与您的模型的属性名称匹配。 – NibblyPig

你的问题有点含糊。你有'List '你需要转换成'事件数组'吗？ –

这里我回答simmilar问题http://stackoverflow.com/questions/17485568/send-model-to-jquery/17485695#17485695 –

你需要用你的代码在一个循环中，可以考虑这样的事情：

var someArray = [] 

@for (int i=0; i < this.Model.myArray.length; i++) 
{ 
    someArray.push([{ Prop = this.Model.myArray[i].someProp . . . } ]); 
}

或者，您也可以将属性添加到您的模型，例如。

public class MyModel 
{ 

    public string SerialisedData { 
     get { 
      return string.Format("[{ name = {0}, someProp = {1} ...... }]", this.Name, this.someProp .....); 
     } 
    } 
}

但记得要引号。

来源

2013-07-15 15:14:09 NibblyPig

抱歉，但我不明白你的意思是这段代码我把这个添加到我的代码中'$（document）.ready（function（）{var 0,1Array = []; @for someArray.push（[{Prop = this.Model.Get_List_Tache [i]}]）; }'但变量'someArray'未定义!! –

我想你可能不得不明确地告诉它someArray不是C＃代码，它是javascript。你可能不得不把'@：'放在行上，比如：'@：someArray.push .....' – NibblyPig

回答

相关问题