Jquery UI Tabs with ajax content: Hrefs not working. -
trying use ui tabs replace traditional links. have hit snag getting href
attribute resolve specified url
upon clicking tabs.
below html:
<div id = "tabs"> <ul> <li><a href = "#main" >main content</a></li> <li><a href = "<?php echo base_url.'inventory/list' ?>">list</a></li> <li><a href = "<?php echo base_url.'inventory/add' ?>">add</a></li> <li><a href = "<?php echo base_url.'inventory/edit' ?>">edit</a></li> </ul> </div>
jquery:
<script type="text/javascript"> $(document).ready(function(){ $('#tabs').tabs(); }) </script>
html body:
<div id = "main"> <?php $this->load->view($main); ?> </div>
inspecting ui tabs
using firebug shows e.g list
http://localhost/inventory#ui-tabs-1
instead of (i imagine if load right content)
http://localhost/inventory/list#ui-tabs-1
only #main
tab loads correct content, nothing (other firebug inspection reading ui-tabs-x
, x index of tab clicked ) changes upon clicking other tabs.
is there missing? how can better?
thanks in advance.