John Goldman John Goldman - 1 year ago 272
HTML Question

jquery-1.9.1.js:4421 Uncaught Error: Syntax error, unrecognized expression: /item/category/category_details/7

I am trying to implement bootstrap tabulation menu and each tab is a new page

This is my java script

<script type="text/javascript">
$(".nav-tabs a").click(function(){
$('.nav-tabs a').on('', function(event){
var x = $(; // active tab
var y = $(event.relatedTarget).text(); // previous tab
$(".act span").text(x);
$(".prev span").text(y);

And this is my html for tabulation menu

<div class="container">
<ul class="nav nav-tabs">
<li role="presentation" class="active">
<a href="/item/material/material_details/7">BOM</a></li>
<li role="presentation"><a href="/item/category/category_details/7">Manufacture</a></li>
<li role="presentation"><a href="/item/material/material_details/7">Product</a></li>
<li role="presentation"><a href="/item/material/material_details/7">UOM</a></li>

And below the error I am getting each time I select a new tab and obviously my tab doesn't change to active. I assume I am trying to something that is not intended to work with direct links but should work only with divs on the same page. Is there is a way getting of tabulation effect in this way without having separate active tab menu for every page?

jquery-1.9.1.js:4421 Uncaught Error: Syntax error, unrecognized expression: /item/category/category_details/7

Answer Source

Bootstrap tabs expect the href to be a hash which is parsed as a selector, specifically an ID selector, by jQuery. That hash corresponds to the ID of the section to display. Your hrefs appear to be urls instead of hashes causing it to fail.