CODEWITHSUNDEEP
javascriptphphyperlink
Haley
Haley

Reputation: 17

Javascript for creating breadcrumbs with links to each breadcrumb?

I'm trying to create breadcrumbs with the user's selection from a listbox that updates the breadcrumbs' last value. I've gotten it to work, but you can't click on 'Home' or 'Store' to go to previous pages. So I tried adding links to the values in my script, but it continues to print the link with the string rather than just make the string a link. Any tips?

$("select")
  .change(function () {
    var val = "";
    var str1 = "Home";
    var str2 = "Store";
    var str3 = str1.link("home.php") + " / " + str2.link("store.php") + " / " + val;

    $("select option:selected").each(function () {
      val = $(this).text();
    });
    $(".breadcrumbs").text(str3);
  })
  .change();

This is my HTML & PHP where it's pulling distinct items from my database and populating a list box:

<div class="breadcrumbs col-sm-4">
    <!-- Update this based on the selected box using the script at the bottom of the page-->
    <!-- bread crumbs -->
</div>
<div class="col-sm-offset-3 col-sm-2">
    <select id="productselect" class="form-control" name="category">
        <option value="All Products">All Products</option>
        <!-- Populate the listbox with distinct category of items from the database -->
        <? do { ?>
            <option value='"$row[0]"'>
                <?="$row[0]" ?>
            </option>;
        <? } while($row=m ysqli_fetch_array($result)) ?>
    </select>
    <? mysqli_free_result($result); mysqli_close($db); ?>
    </select>
</div>

Upvotes: 0

Views: 720

Answers (1)

Scimonster
Scimonster

Reputation: 33409

If your string contains HTML (which it does), you need to use jQuery's .html() method to add it, instead of .text() (which escapes HTML):

$(".breadcrumbs").html(str3);

Also, you probably want to place the block above it ($("select option:selected").each(...)) before you set str3.

Upvotes: 2

Related Questions