2009-05-21 12 views
0

Est-il possible de réutiliser un modèle client en utilisant des modèles de client asp.net ajax 4.0? J'ai un scénario comme indiqué dans l'exemple ci-dessous. J'ai deux questions ici:Modèles clients Asp.net -

  1. Je ne pouvais pas le cas conditionwork dans le client-modèle
  2. Comment puis-je réutiliser le modèle balise ul pour trois types de données « colonne » (col1, col2 , col3 dans exemple json)?

exemple de code:

<style> 
    .sys-template { display:none; } 
    .list {width:220px; float:left; margin:0px 0px 0px 10px; background-color:#f2f2f2; } 
    </style> 

    <script src="MicrosoftAjax.debug.js" type="text/javascript"></script> 
    <script src="MicrosoftAjaxTemplates.debug.js" type="text/javascript"></script> 

    <script type="text/javascript"> 
     var listItems = [{ item: "item1", col: "col1" }, 
         { item: "item2", col: "col1" }, 
         { item: "item3", col: "col1" }, 
         { item: "item4", col: "col2" }, 
         { item: "item5", col: "col2" }, 
         { item: "item6", col: "col2" }, 
         { item: "item7", col: "col2" }, 
         { item: "item8", col: "col3" }, 
         { item: "item9", col: "col3" }, 
         { item: "item10", col: "col3" }] 
    </script> 
    </head> 

    <body xmlns:sys="javascript:Sys" xmlns:dataview="javascript:Sys.UI.DataView" sys:activate="*"> 
    <ul id="col1" class="list sys-template" sys:attach="dataview" dataview:data="{{ listItems }}"> 
     <!--* if (col=="col1") { *--> 
     <li>{{item}}</li> 
     <!--* } *--> 
    </ul> 
    <ul id="col2" class="list sys-template" sys:attach="dataview" dataview:data="{{ listItems }}"> 
     <!--* if (col=="col2") { *--> 
     <li>{{item}}</li> 
     <!--* } *--> 
    </ul> 
    <ul id="col3" class="list sys-template" sys:attach="dataview" dataview:data="{{ listItems }}"> 
     <!--* if (col=="col3") { *--> 
     <li>{{item}}</li> 
     <!--* } *--> 
    </ul> 
    </body> 

Répondre

0

Quelque chose comme ça devrait fonctionner - je suis en train de taper ceci à la volée alors pardonnez-moi si ce n'est pas parfait.

<ul id="template1" class="sys-template"> 
    <li code:if="col==$element.id">{{item}}</li> 
</ul> 

<ul id="col1" class="list sys-template" sys:attach="dataview" dataview:data="{{listItems }}" dataview:itemtemplate="template1"> 
</ul> 
<ul id="col2" class="list sys-template" sys:attach="dataview" dataview:data="{{listItems }}" dataview:itemtemplate="template1"> 
</ul> 
<ul id="col2" class="list sys-template" sys:attach="dataview" dataview:data="{{listItems }}" dataview:itemtemplate="template1"> 
</ul> 
+0

InfinitiestLoop, C'est ce dont j'avais besoin, un exemple :) merci beaucoup. La seule chose qui doit être modifiée dans votre exemple est que l'implémentation réelle du modèle ne doit pas avoir la classe "sys-template", sa sortie qui se cache réellement. Alors je l'ai changé:

    travaillé comme un charme –

    +0

    dataview: itemtemplate = devrait être dataview: itemTemplate = –

    0

    En aperçu 4, vous injectez code en utilisant le code suivant: avant et code: après attributs au lieu des blocs de code de commentaire.

    Il est également possible de réutiliser un modèle. En fait, le framework le fera pour vous: si vous pointez la propriété template de deux vues de données sur le même élément, un seul template sera compilé et utilisé.

    +0

    Merci pour une réponse rapide Bertrand. –

    Questions connexes