Question

I want show breadcrumbs in my site.. I have used jquery bbq in my website.

and i tried to implement the breadcrumbs like in my site.

My BreadCrumbs View File includes:

<ul class="breadcrumb">

</ul>

in the script of bbq i tried like this,

var url = $.param.fragment();
            var breadcrumb=$('.breadcrumb');
            var BreadCrumbBar ='<li><a href="#">PBS</a><span class="divider">></span></li>';
            var BreadCrumbsSplit = url.split('/');
            breadcrumb.empty();
            breadcrumb=BreadCrumbBar;

            $.each(BreadCrumbsSplit,function(breadurl){
                breadcrumb.append('<li><a href="#'+BreadCrumbsSplit[breadurl]+'"></a></li>\n');
            });

Here is what i am trying to do, but cant quite figure out, how to implement it?

First i am getting Error in FireBug that .append is not a function,

Second, in .each() loop i want to add this line too <span class="divider">/</span> in <li><a href="#'+BreadCrumbsSplit[breadurl]+'"></a></li>

What it will do, it will add / between breadcrumbs, but i don't want this / within the last <li></li> tags..

Can anyone help me in this regard, that how to achieve it?

Simply in the End Result i want code generated some thing like this

<li><a href="#">PBS</a> <span class="divider">/</span></li>
    <li><a href="#home">Home</a> <span class="divider">/</span></li>
    <li><a href="#library">Library</a> <span class="divider">/</span></li>
    <li class="active">Data</li>
Was it helpful?

Solution

var url = $.param.fragment();
var breadcrumb=$('.breadcrumb');
var BreadCrumbBar ='<li><a href="#">PBS</a><span class="divider">></span></li>';
var BreadCrumbsSplit = url.split('/');
var total = BreadCrumbsSplit.length;
breadcrumb.empty();
breadcrumb=BreadCrumbBar;

$.each(BreadCrumbsSplit,function(index){
    if(index !== total-1){
    breadcrumb.append('<li><a href="#'+BreadCrumbsSplit[index]+'"></a><span class="divider">/</span></li>\n');
    }else{
    breadcrumb.append('<li><a href="#'+BreadCrumbsSplit[index]+'"></a></li>\n');
    }
});

sry not tested, but it should work.. :) added number of total elements, and if last element dont insert divider, if there is llmistake you can fix it easily

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top