سؤال

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

الطبقة النهائية

شكرا جزيلا على أي اقتراحات/مؤشرات.

هل كانت مفيدة؟

المحلول

إذا كنت تريد خبزًا حقيقيًا ، فيمكنك إلقاء نظرة على السؤال التالي ( كيف يمكن تحقيق فتات الخبز الديناميكية باستخدام ASP.NET MVC؟ )

بخلاف ذلك ، يمكنك استخدام المنطق والمنظر الجزئي إلى حد كبير لإنجاز هذا وعرض صورة معينة في نقطة معينة في سير العمل من عرض جزئي.

يمكنك أيضًا إلقاء نظرة على بعض jQuery ذكيhttp://plugins.jquery.com/project/jbreadcrumb

نصائح أخرى

قمنا بتنفيذ شيء على غرار صفحة رئيسية تضم فتات الخبز ، ثم كل صفحة MVC ، عند الضرورة ، تستدعي بعض JavaScript على تحميل المستند لتعيين الخبز.

استخدمنا jQuery حتى في كل صفحة قد يكون لدينا

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

أو مشابه.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top