asp.net MVC - Найпросты спосаб забяспечыць альтэрнатыўны стыль радкі ў брытву

Улічваючы наступны Razor код:

<tbody>
    @foreach (Profession profession in Model)
    {
        <tr>
            <td>@profession.Name</td>
            <td>@profession.PluralName</td>
            <td>@Html.ActionLink("Edit", "AddOrEdit", new { Id = profession.ProfessionID })</td>
        </tr>
    }
</tbody>

Што гэта самы просты спосаб, каб забяспечыць нейкае альтэрнатыўная радок стылю? (То бок адрозніваецца стыль для няцотных і цотных радкоў.)

Я, здаецца, не быць у стане дадаць адвольнае C#, каб абвясціць Bool зменную, якая атрымлівае перавернуты кожную ітэрацыю Еогеасп Пятля для таго, каб усталяваць імя класа для <�код > тр , напрыклад.

10

5 адказы

Я б рэкамендаваў рабіць гэта ў прамым CSS ( глядзіце тут больш падрабязна ):

tr:nth-child(odd)    { background-color:#eee; }
tr:nth-child(even)   { background-color:#fff; }
45
дададзена
Гэта CSS3. Не кожны браўзэр падтрымлівае яго.
дададзена аўтар Aliostad, крыніца
Так, але залежыць, хто ваша аўдыторыя. У галіне я знаходжуся, большасць браўзэраў IE6.
дададзена аўтар Aliostad, крыніца
Сардэчна запрашаем у Вялікабрытанію НГС. 90% браўзэраў у Вялікабрытаніі NHS з'яўляюцца IE6. План пераходу на IE7 ў 2012 годзе! Яны былі прыкладання, распрацаваныя спецыяльна для IE6, які толькі працуе ў, ну, IE6.
дададзена аўтар Aliostad, крыніца
Ну, мы сказалі, што трэба запускаць праграмнае забеспячэнне ў храмаванай раме, так што тэарэтычна я мог бы выкарыстаць Tr: п-й дзіця . Але ўсё-ткі на карысць як мага больш шырокую аўдыторыю.
дададзена аўтар Aliostad, крыніца
@Aliostad - мы пішам вэб-прыкладанні для NHS людзей таксама. Я адчуваю вашу боль. Але гэта адна толькі ўнутраная, так што я магу зрабіць усё CSS3 мне падабаецца. Ура!
дададзена аўтар David, крыніца
Я даю гэты няблага, таму што ён працуе для мяне, і гэта самае простае рашэнне.
дададзена аўтар David, крыніца
Сучасныя браўзэры падтрымліваюць яго. І для састарэлых браўзэраў не будзе чаргуюцца радкі колер => не мае вялікага значэння. Людзі, якія выкарыстоўваюць састарэлыя браўзэры, верагодна, ужо прывыклі бачыць па-рознаму аказаныя вэб-сайты ў Інтэрнэце.
дададзена аўтар Darin Dimitrov, крыніца
@Aliostad, гэта выглядае вельмі дзіўна для мяне, што галіна, якая можа зрабіць намаганне, каб выкарыстоўваць найноўшыя тэхналогіі ад Microsoft для распрацоўкі сваіх вэб-прыкладанняў (ASP.NET MVC 3) выкарыстоўвае 3 пакаленняў старога вэб-браўзэр. Я маю на ўвазе IE6, на самай справе, гэта ўсё яшчэ існуе?
дададзена аўтар Darin Dimitrov, крыніца
<�Код> План пераходу на IE7 ў 2012 годзе . Няхай Бог памілуе вашы душы.
дададзена аўтар Darin Dimitrov, крыніца
Тое ж самае ставіцца і да большай частцы фармацэўтычнай прамысловасці. 95% нашага браўзэра трафіку IE6.
дададзена аўтар Simon Halsey, крыніца
На самай справе, і я думаў, але пытанне, зададзены для «простага шляху», і я лічу, што гэта.
дададзена аўтар harriyott, крыніца

JQuery можна зрабіць гэта на баку кліента (і я б, верагодна, выкарыстоўваць на баку кліента быў тут, а не логікі сервера).

 $("tr:odd").css("background-color", "#bbbbff");

Акрамя таго, можна выкарыстоўваць толькі простую зменную, каб усталяваць клас CSS (амаль псеўда-код):

@foreach (Profession profession in Model)
{
    @i++;
    <td class="@i%2==0?"even":"odd""> 

}
10
дададзена
Каб пазбегнуць скаргаў ад Visual Studio дужкі выкарыстоўваюць, напрыклад <�Тр клас = "@ (я% 2 == 0?" ":" Альт ")">
дададзена аўтар Ronnie, крыніца

Там шмат спосабаў, як іншыя прапанавалі. З майго пункту, гэта будзе не самы просты, але трохі прасцей:

<tbody>
    @var oddEven = new List { "odd", "even" };
    @var i = 0;
    @foreach (Profession profession in Model)
    {
        <tr style="@oddEven[i++ % 2]">
            <td>@profession.Name</td>
            <td>@profession.PluralName</td>
            <td>@Html.ActionLink("Edit", "AddOrEdit", new { Id = profession.ProfessionID })</td>
        </tr>
    }
</tbody>
3
дададзена

Прашу прабачэння, што гэта крыху тупы адказ, як вы ўжо робіце нацэнку, але, як ваш стол выглядае даволі стандартным вы можаце пераключыцца на выкарыстанне вэб-Mvc сеткі Helper. Гэта акуратны інструмент для табліц, як гэта. Я думаю, што ваш код будзе трохі карацей/прасцей для гэтай канкрэтнай табліцы, а фактычная рэалізацыя стылю чаргуюцца радкоў будзе вельмі проста:

alternatingRowStyle: "alternateRow"

Больш падрабязную інфармацыю аб гэты блог asp.net .

2
дададзена
Мне падабаецца ідэя гэтага кантролю, але гэта заняло б даволі шмат больш працы, чым некаторыя з іншых рашэнняў. Дзякуй за спасылку, хоць.
дададзена аўтар David, крыніца

Так як вы карыстаецеся MVC Razor з выкарыстаннем функцыі @helper з'яўляецца самым простым, чыстым і лепшым падыходам.

У тэчцы App_Code вашага праекта дадаць новы элемент або змяніць існуючы файл CustomeHelpers.cshtml са наступным кодам:

@helper AlternateBackground(string color, Int32 iViewBagCount) {
    if (iViewBagCount == null) { iViewBagCount = 0; }
    style="background-color:@(iViewBagCount % 2 == 1 ? color : "none")"
    iViewBagCount++;
}

Тады на ваш погляд, усярэдзіне цыклу Еогеасп, заменіце код TableRow з тым, што паказана ніжэй:

<tr @CustomHelpers.AlternateBackground("#ECEDEE", ViewBag.count)>

or

<tr @CustomHelpers.AlternateBackground("Red", Model.Count())>

Whichever is appropriate for your foreach loop

This way you only have to add the @Helper function once and it propagates throughout your application and it can be called on each view as needed by referencing the @CustomHelpers function. Create as many helpers as you need and call them with the @CustomeHelpers.NameOfYourFunction() and go from there.

Simple and effective...

1
дададзена