Отображать разные значки, если число равно 1 или 0 - ASP.NET C # MVC JQuery - PullRequest
Новая
       3

Отображать разные значки, если число равно 1 или 0 - ASP.NET C # MVC JQuery

0 голосов
/ 11 мая 2018

У меня есть модель, которая генерирует случайное число: 

public int IsLocked
{
    get
    {
        var rnd = new Random();
        return rnd.Next(0, 2);
    }
}

Это мое частичное представление: 

<table class="table table-striped table-hover dataTable admin-form theme-primary songsTable" cellspacing="0" width="100%" role="grid">
    <thead id="tableHeader">
        <tr>
            <th class="bg-white text-left hidden-xs">
                Song ID
            </th>
            <th class="sorting text-left @Html.SortTitleItem("Title", Model.PagingInfo.SortPropertyName, Model.PagingInfo.SortAscending)">
                <a href="@Url.Action("SongManagement", "ArtistAccount", new
                     {
                         page = 1,
                         take = Model.PagingInfo.Take,
                         sortBy = "Title",
                         sortAsc = Model.PagingInfo.SortPropertyName != "Title" || !Model.PagingInfo.SortAscending
                     })" data-container="body" data-toggle="tooltip" title="Sort by Song Title">Song Title</a>
            </th>
            <th class="sorting text-left hidden-xs hidden-sm @Html.SortTitleItem("CreatedDate", Model.PagingInfo.SortPropertyName, Model.PagingInfo.SortAscending)">
                <a href="@Url.Action("SongManagement", "ArtistAccount", new
                     {
                         page = 1,
                         take = Model.PagingInfo.Take,
                         sortBy = "CreatedDate",
                         sortAsc = Model.PagingInfo.SortPropertyName != "CreatedDate" || !Model.PagingInfo.SortAscending
                     })" data-container="body" data-toggle="tooltip" title="Sort by Created Date">Created Date</a>
            </th>
            <th class="bg-white text-left hidden-xs hidden-sm">
                Writers
            </th>
            <th class="bg-white text-left hidden-xs hidden-sm">
                Recordings
            </th>
            <th class="bg-white text-left hidden-xs hidden-sm">
                State
            </th>
            <th class="bg-white text-left">
                <div class="text-center">Action</div>
            </th>
        </tr>
    </thead>
    <tbody>

        @foreach (var t in Model.Songs)
        {
            var actionWorkId = "actionWork_" + tableRowIndex;
            var recordingWorkId = "recordingWork_" + tableRowIndex;
            var editWorkId = "jsEditWork_" + tableRowIndex;
            var deleteWorkId = "deleteWork_" + tableRowIndex;
            var tuneCodeId = "tuneCode_" + tableRowIndex;

            var writerShares = string.Join("<br />", t.Writers.Select(w => w.IsUnknown ? "UNKNOWN: " + string.Format("{0:0.00}", w.Share) + "%"
                                                                                        : w.Name + ": " + string.Format("{0:0.00}", w.Share) + "%"));

        <tr data-id="@t.ID"
            data-rowversion="@t.RowVersion">
            <td class="hidden-xs">
                @t.SongId
            </td>
            <td>
                @t.Title
            </td>
            <td class="hidden-xs hidden-sm">
                @t.CreatedDate
            </td>
            <td class="hidden-xs hidden-sm">
                <span class="label label-rounded label-primary" data-container="body" data-toggle="tooltip" data-html="true" title="@writerShares">@t.Writers.Count()</span>
            </td>
            <td class="hidden-xs hidden-sm">
                <span class="label label-rounded label-default">@t.Recordings</span>
            </td>
            <td class="hidden-xs hidden-sm">
                <span class="glyphicon glyphicon-lock">@t.IsLocked</span>
            </td>
            <td class="updateTableRow text-center">
                <div class="dropdownContainer btn-group text-right">
                    <button id="@actionWorkId" type="button" class="btn btn-primary br2 btn-xs fs12 dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                        Action
                        <span class="caret ml5"></span>
                    </button>
                    <ul class="dropdown-menu dropdown-menu-right" role="menu">
                        <li class="disabled">
                            <a href="@Url.Action("Recordings", "ArtistAccount", new
                                {
                                    accountcode = fullAccountCode,
                                    songcode = t.SongId
                                })" id="@recordingWorkId" data-container="body" data-toggle="tooltip" title="You cannot edit this song until pending writer edits are approved" data-rowhover="editTableRow" class="js_Recordings">Recordings</a>
                        </li>
                        <li class="disabled">
                            <a href='@Url.Action("EditSong", "ArtistAccount", new
                                     {
                                         songcode = t.SongId,
                                         accountcode = fullAccountCode,
                                         page = Model.PagingInfo.Page,
                                         take = Model.PagingInfo.Take,
                                         sortBy = Model.PagingInfo.SortPropertyName,
                                         sortAsc = Model.PagingInfo.SortAscending
                                     })' id="@editWorkId" data-container="body" data-toggle="tooltip" data-rowhover="editTableRow" class="disabled" title="You cannot edit this song until pending writer edits are approved">Edit</a>
                        </li>
                        <li>
                            <a href="#" id="@deleteWorkId" data-container="body" data-toggle="tooltip" title="Delete" data-rowhover="deleteTableRow" class="js_DeleteSong">Delete</a>
                        </li>
                        <li>
                            <a href="@Url.Action("TuneCodes", "ArtistAccount", new
                                    {
                                        accountCode = fullAccountCode,
                                        workCode = t.SongId,
                                    })" id="@tuneCodeId" data-container="body" data-toggle="tooltip" title="Tune Codes" data-rowhover="editTableRow">Tune Codes</a>
                        </li>
                    </ul>
                </div>
            </td>
        </tr>
            tableRowIndex++;
        }
    </tbody>
</table>

@Html.Partial("_Pagination", Model.PagingInfo)
</div>

У меня есть генерирование случайного числа, но есть ли способ, которым яможет показать блокировку, которая равна <span class="glyphicon glyphicon-lock">, если число равно 1, а затем <span class="glyphicons glyphicons-unlock"></span>, если число равно нулю.

Я думал о том, чтобы попытаться сделать что-то в JQuery, но если у кого-то есть другой подход, который быбудь великим.

Ответы [ 3 ]

0 голосов
/ 11 мая 2018

Вы можете использовать JQuery, если / else 

var x = IsLocked.get();
if (x == 1) {
    $('.glyphicon-lock').show();
    $('.glyphicons-unlock').hide();
} else {
    $('.glyphicon-lock').hide();
    $('.glyphicons-unlock').show();
}

Или вы можете следовать по пути ASP.NET

  • Добавить runat = "server" на ваш элемент (иID)
  • Переключить его из кода

HTML 

<span runat="server" id="locked" class="glyphicon glyphicon-lock"></span>
<span runat="server" id="unlocked" class="glyphicons glyphicons-unlock"></span>

C # 

{
    int x = IsLocked.get();
    if (x == 1) {
        locked.Visible = true;
        unlocked.Visible = false;
    } else {
        locked.Visible = false;
        unlocked.Visible = true;
    }
}

Этот ответ может быть полезен: Как скрыть div от кода (c #)

0 голосов
/ 11 мая 2018 
@{
    var loc_unlock = "";

    <div>
        <table class="table table-striped table-hover dataTable admin-form theme-primary songsTable" cellspacing="0" width="100%" role="grid">
            <thead id="tableHeader">
                <tr>
                    <th class="bg-white text-left hidden-xs">
                        Song ID
                    </th>
                    <th class="sorting text-left @Html.SortTitleItem("Title", Model.PagingInfo.SortPropertyName, Model.PagingInfo.SortAscending)">
                        <a href="@Url.Action("SongManagement", "ArtistAccount", new
                     {
                         page = 1,
                         take = Model.PagingInfo.Take,
                         sortBy = "Title",
                         sortAsc = Model.PagingInfo.SortPropertyName != "Title" || !Model.PagingInfo.SortAscending
                     })" data-container="body" data-toggle="tooltip" title="Sort by Song Title">Song Title</a>
                    </th>
                    <th class="sorting text-left hidden-xs hidden-sm @Html.SortTitleItem("CreatedDate", Model.PagingInfo.SortPropertyName, Model.PagingInfo.SortAscending)">
                        <a href="@Url.Action("SongManagement", "ArtistAccount", new
                     {
                         page = 1,
                         take = Model.PagingInfo.Take,
                         sortBy = "CreatedDate",
                         sortAsc = Model.PagingInfo.SortPropertyName != "CreatedDate" || !Model.PagingInfo.SortAscending
                     })" data-container="body" data-toggle="tooltip" title="Sort by Created Date">Created Date</a>
                    </th>
                    <th class="bg-white text-left hidden-xs hidden-sm">
                        Writers
                    </th>
                    <th class="bg-white text-left hidden-xs hidden-sm">
                        Recordings
                    </th>
                    <th class="bg-white text-left hidden-xs hidden-sm">
                        State
                    </th>
                    <th class="bg-white text-left">
                        <div class="text-center">Action</div>
                    </th>
                </tr>
            </thead>
            <tbody>

                @foreach (var t in Model.Songs)
                {
                    var actionWorkId = "actionWork_" + tableRowIndex;
                    var recordingWorkId = "recordingWork_" + tableRowIndex;
                    var editWorkId = "jsEditWork_" + tableRowIndex;
                    var deleteWorkId = "deleteWork_" + tableRowIndex;
                    var tuneCodeId = "tuneCode_" + tableRowIndex;

                    var writerShares = string.Join("<br />", t.Writers.Select(w => w.IsUnknown ? "UNKNOWN: " + string.Format("{0:0.00}", w.Share) + "%"
                                                                                                : w.Name + ": " + string.Format("{0:0.00}", w.Share) + "%"));

                    <tr data-id="@t.ID"
                        data-rowversion="@t.RowVersion">
                        <td class="hidden-xs">
                            @t.SongId
                        </td>
                        <td>
                            @t.Title
                        </td>
                        <td class="hidden-xs hidden-sm">
                            @t.CreatedDate
                        </td>
                        <td class="hidden-xs hidden-sm">
                            <span class="label label-rounded label-primary" data-container="body" data-toggle="tooltip" data-html="true" title="@writerShares">@t.Writers.Count()</span>
                        </td>

                        @if (t.Recordings == 1)
                        {
                            loc_unlock = "< span class=\"glyphicon glyphicon-lock\">";
                        }
                        else
                        {
                            loc_unlock = "<span class=\"glyphicons glyphicons-unlock\"></span>";
                        }
                        <td class="hidden-xs hidden-sm">
                            <span class="label label-rounded label-default">@t.Recordings</span>
                        </td>
                        <td class="hidden-xs hidden-sm">
                            <span class="glyphicon glyphicon-lock">@loc_unlock</span>
                        </td>
                        <td class="updateTableRow text-center">
                            <div class="dropdownContainer btn-group text-right">
                                <button id="@actionWorkId" type="button" class="btn btn-primary br2 btn-xs fs12 dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                                    Action
                                    <span class="caret ml5"></span>
                                </button>
                                <ul class="dropdown-menu dropdown-menu-right" role="menu">
                                    <li class="disabled">
                                        <a href="@Url.Action("Recordings", "ArtistAccount", new
                                {
                                    accountcode = fullAccountCode,
                                    songcode = t.SongId
                                })" id="@recordingWorkId" data-container="body" data-toggle="tooltip" title="You cannot edit this song until pending writer edits are approved" data-rowhover="editTableRow" class="js_Recordings">Recordings</a>
                                    </li>
                                    <li class="disabled">
                                        <a href='@Url.Action("EditSong", "ArtistAccount", new
                                     {
                                         songcode = t.SongId,
                                         accountcode = fullAccountCode,
                                         page = Model.PagingInfo.Page,
                                         take = Model.PagingInfo.Take,
                                         sortBy = Model.PagingInfo.SortPropertyName,
                                         sortAsc = Model.PagingInfo.SortAscending
                                     })' id="@editWorkId" data-container="body" data-toggle="tooltip" data-rowhover="editTableRow" class="disabled" title="You cannot edit this song until pending writer edits are approved">Edit</a>
                                    </li>
                                    <li>
                                        <a href="#" id="@deleteWorkId" data-container="body" data-toggle="tooltip" title="Delete" data-rowhover="deleteTableRow" class="js_DeleteSong">Delete</a>
                                    </li>
                                    <li>
                                        <a href="@Url.Action("TuneCodes", "ArtistAccount", new
                                    {
                                        accountCode = fullAccountCode,
                                        workCode = t.SongId,
                                    })" id="@tuneCodeId" data-container="body" data-toggle="tooltip" title="Tune Codes" data-rowhover="editTableRow">Tune Codes</a>
                                    </li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                    tableRowIndex++;
                }
            </tbody>
        </table>

        @Html.Partial("_Pagination", Model.PagingInfo)
    </div>
}
0 голосов
/ 11 мая 2018

Вы можете сделать простой if / else с Razor, просто так: 

@if (t.IsLocked == 1)
{
    <span class="glyphicon glyphicon-lock"></span>
} else { 
    <span class="glyphicons glyphicons-unlock"></span>
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...