web-dev-qa-db-fra.com

Comment masquer un élément div en fonction de la valeur du modèle? MVC

Voici ce que j'ai en ce moment

 hidden="@(Model.IsOwnedByUser||!Model.CanEdit)"

Cela fonctionne bien sur Chrome mais ne cache pas sous Internet Explorer

J'ai aussi essayé de mettre la visibilité en faux mais pas de chance.

alors j'ai découvert un autre style comme ci-dessous

style="@(Model.IsOwnedByUser||!Model.CanEdit)?'display:none'""

Je ne pouvais pas le faire fonctionner. Quel est le format correct pour masquer un élément avec la syntaxe Razor?

Ou j'utiliserais Jquery pour masquer l'élément. mais est-il réellement possible d'imprimer une instruction jquery qui cacherait l'élément lors du chargement de la page?

jqueryhtmlasp.net-mvcrazor
41
akd

Le code ci-dessous devrait appliquer différentes classes CSS en fonction de la valeur de la propriété CanEdit de votre modèle.

<div class="@(Model.CanEdit?"visible-item":"hidden-item")">Some links</div>

Mais s'il s'agit de quelque chose d'important comme Modifier/Supprimer des liens, vous ne devez pas simplement vous cacher, car les utilisateurs peuvent mettre à jour le balisage HTML/classe CSS dans leur navigateur et accéder à votre lien important. Au lieu de cela, vous devriez être simplement pas le rend l'essentiel pour le navigateur.

@if(Model.CanEdit)
{
  <div>Edit/Delete link goes here</div>
}
87
Shyju

Essayer:

<div style="@(Model.booleanVariable ? "display:block" : "display:none")">Some links</div>

Utilisez l'attribut de style "Display" avec votre attribut de modèle bool pour définir la visibilité de la div.

28
Yuri

Votre code ne fonctionne pas, car l'attibute masqué n'est pas pris en charge dans les versions de IE avant v11

Si vous devez prendre en charge IE avant la version 11, ajoutez un style CSS à masquer lorsque l'attribut masqué est présent:

*[hidden] { display: none; }
3
kristianp