一見シンプルなMVC部分ビュー質問
-
18-09-2019 - |
質問
私は私の部分図でテーブルの2列に私のデータ(画像)を表示しようとしています。以下のコードは、それ自体の行の各画像を表示するように動作するようには思えません。私は何をしないのですか?
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<%@ Import Namespace="ULS_Site.Models"%>
<%var alternating = false;%>
<table>
<% foreach (var item in ViewData.Model as IEnumerable<image>) %>
<%{%>
<%if (!alternating) %>
<%{ %>
<tr>
<%}; %>
<td>
<a href="<%= item.image_path %>" target="_blank" >
<img src="<%= item.image_path %>" alt=" " width="100" />
</a>
</td>
<%if (!alternating) %>
<%{ %>
</tr>
<%}; %>
<%alternating = !alternating;%>
<%}%>
</table>
解決
<%if (alternating) %>
<%{ %>
</tr>
<%}; %>
EDIT:tr
を閉じるときは、条件を逆にする必要があります
。
これは、実行ラインtr
までalternative = !alternating;
を閉じません。
EDIT2:?また、なぜあなたは、コードモードに残っているとき、ラインのそれぞれに<%=
と%>
を開閉している。
すなわち、それを書くためのクリーンな方法はありませんか?
<%if (alternating)
{%>
</tr>
<%}; %>
他のヒント
私は読みやす主導のアプローチをお勧めします。これらの他のsoulutionsに加えて、あなたも懸念の分離は少し良く支配観察するためにLIタグ内の各項目をリストを使用して表示することができます。 CSSとjQueryのふりかけに基づくいくつかの規格が小さくて読みやすいコードを維持することができます:
<ul>
<% foreach (var item in ViewData.Model as IEnumerable<image>) { %>
<li>
<a href="<%= item.urlPath %>">
<img src="<%= item.imagePath %>" alt="" /></li>
<% } %>
</ul>
CSSは、このような単純なことができます。
ul {
width:200px; /* twice the individual LI width */
}
ul li {
height:60px;
width:100px;
margin:0;
padding:0;
float:left;
list-style-type:none;
}
そして今、あなたは生の出力を持っていると扱わ構造化されたことを、少しjQueryのは、あなたの代わりのディスプレイニーズの世話をすることができます。これは次の2つの垂直列が得られます。
<script type="text/javascript">
$(function() {
$("li:odd").css("background-color", "#F00");
});
</script>
わずかに異なるjQueryのセレクタが代替水平方向の行に色を塗ることができます。
これを試してみてください、これはtableeで行ごとに2つの列をレンダリングすると、あなたの問題を解決します。
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<%@ Import Namespace="ULS_Site.Models"%>
<%var alternating = true;%>
<table>
<% foreach (var item in ViewData.Model as IEnumerable<image>) %>
<%{%>
<%if (alternating) %>
<%{ %>
<tr>
<%}; %>
<td>
<a href="<%= item.image_path %>" target="_blank" >
<img src="<%= item.image_path %>" alt=" " width="100" />
</a>
</td>
<%if (!alternating) %>
<%{ %>
</tr>
<%}; %>
<%alternating = !alternating;%>
<%}%>
</table>
所属していません StackOverflow