Создание графического крошки или процесса в .NET MVC 2 - PullRequest
Новая
       11

Создание графического крошки или процесса в .NET MVC 2

5 голосов
/ 03 сентября 2010

Breadcrumb trail

У меня есть структура, похожая на изображение выше. Он отображает ход выполнения форм, отображает имена форм и текущую страницу, а также дает пользователю руководство по началу и окончанию процесса.

Первоначально он был составлен в классическом ASP. Что было бы лучшим подходом для воссоздания этого в MVC 2 - C #

В ответ на один из ответов ниже: я не хочу, чтобы это было по всему сайту, я искал решение для хлебобулочных изделий для набора форм - так, например, у меня может быть набор форм для жалобы или набор предложений и т. д. Поэтому мне нужно иметь возможность передавать детали формы во что-то вроде помощника или функции, которая затем выдаст результат, аналогичный изображенному выше.

Это оригинальный классический код ASP, который генерирует след .. 

Class BreadCrumb

Private dicCrumbs
Private arrIcons()
Private arrColours()

Public Sub Crumb(Text, Icon)

    dicCrumbs(Text) = Icon

End Sub

Private Sub Class_Initialize()

    Set dicCrumbs = Server.CreateObject("Scripting.Dictionary")

    ReDim arrIcons(2)
    arrIcons(0) = "images/selected-process.gif"
    arrIcons(1) = "images/unselected-process.gif"
    arrIcons(2) = "images/additional-process.gif"

    ReDim arrColours(2)
    arrColours(0) = "#0080C0; font-weight:bold"
    arrColours(1) = "#999999"
    arrColours(2) = "#999999"

End Sub

Public Sub Show()

    Dim strItem, intCrumbs
    %>
    <table style="margin-bottom:10px" class="formbreadcrumbs" cellspacing="0" cellpadding="0" border="0" summary="Bread Crumb Trail">
        <tr>
            <td align="right"><img src="images/left-process30.gif" width="30" height="20" alt=" " /></td>
    <%
    intCrumbs = 0
    For Each strItem In dicCrumbs
        intCrumbs = intCrumbs + 1
        Response.Write "        <td><img src=""" & arrIcons(dicCrumbs(strItem)) & """ width=""25"" height=""20"" alt="" "" /></td>"
        If intCrumbs < dicCrumbs.Count Then
        %>
                <td><img src="images/background-process.gif" width="40" height="20" alt=" " /></td>
                <td><img src="images/background-process.gif" height="20" width="5" alt=" " /></td>
                <td><img src="images/background-process.gif" width="40" height="20" alt=" " /></td>
        <%
        End if
    Next
    %>
            <td align="left"><img src="images/right-process30.gif" width="30" height="20" alt=" " /></td>
        </tr>
        <tr>
    <%
    intCrumbs = 0
    For Each strItem In dicCrumbs
        intCrumbs = intCrumbs + 1
        Response.Write "        <td colspan=""3"" align=""center"" style=""color:" & arrColours(dicCrumbs(strItem)) & "; line-height:0.9em; font-size:x-small"">" & strItem & "</td>"
        If intCrumbs < dicCrumbs.Count Then
        %>
                <td></td>
        <%
        End if
    Next
    %>
        </tr>
    </table>
End Sub

Конечный класс

Большое спасибо за любые предложения / указатели.

Ответы [ 2 ]

2 голосов
/ 03 сентября 2010

Если вам нужна настоящая хлебная крошка, вы можете взглянуть на следующий вопрос ( Как добиться динамических хлебных крошек с помощью ASP.net MVC? )

Кроме этого, вы можете в значительной степени использовать логические и частичные представления для достижения этой цели и отображать определенное изображение в определенной точке рабочего процесса из частичного представления.

Вы также можете взглянуть на какой-нибудь умный jQuery http://plugins.jquery.com/project/jBreadCrumb

1 голос
/ 03 сентября 2010

Мы реализовали что-то по аналогии с главной страницей, в которой хранятся хлебные крошки, затем каждая страница MVC, где это необходимо, вызывает некоторый javascript в загрузке документа, чтобы установить хлебную крошку.страница у нас может быть 

<script type="javascript">
$(document).ready(function(){
  setBreadCrumb(1);
});
</script>

или похожая.

...