Tabs : disabling not working
Hi everyone..
I have following code for tabs functionality :
<div id="contents">
<ul>
<li><a href="#basicInfo" ><span>Basic Information</span> </a> </
li>
<li><a href="#additionalInfo" ><span>Advanced Information</span> </
a> </li>
<li><a href="#attachments" ><span>Attachments</span> </a> </li>
<li><a href="#maps" ><span>Map</span> </a> </li>
<li><a href="#preview" ><span>Preview</span> </a> </li>
</ul>
<!-- BASIC INFORMATION DIV BEGINS -->
<div id="basicInfo">
<jsp:include page="basicInformation.jsp"></jsp:include>
</div>
<div id="additionalInfo">
<jsp:include page="additionalInformation.jsp"></jsp:include>
</div>
<div id="attachments">
<jsp:include page="attachments.jsp"></jsp:include>
</div>
<div id="maps">
maps
</div>
<div id="preview">
preview
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#contents > ul").tabs();
});
I want to disable all tabs except the first one and allow change only
after a validation is done.. How can I do this? I tried jQuery
documentation but either I am not using it properly or something
else.. I am unable to disable the tabs..
Can any one guide how can I disable all tabs except first and also how
to call the validate() function on clicking away from first tab to
allow switching..
Thanks in advance!