Comments (10)
You need to inspect the tab panel element and see that the disabled CssClass is added on each tab you visited and never removed.
I completed with css to be more, visual, here is the link to the project:
Thank you!
from ajaxcontroltoolkit.
I cannot upload ZIP files, please download from: https://we.tl/HpcOwvo0n9 the project. Thank you!
from ajaxcontroltoolkit.
@cristinadorotan
Would you please provide a sample project that illustrates this issue?
from ajaxcontroltoolkit.
Hy, I have the project but how do I send it to you ? (ASp Web Forms, VB.Net) when I select a TAB, navigate to others, return to the first one selected, the CSSClass for each active and disabled is set on that TAB. This messes up our entire project, because we have specific styles for a disabled tab.
from ajaxcontroltoolkit.
You can attach an archive with the project to your comment.
from ajaxcontroltoolkit.
Essentially my problem is that the ajax__tab_disabled class remains on each tab after I access them.
My file is ZIP, but I t won't let me upload it.
from ajaxcontroltoolkit.
I downloaded the sample you provided and clicked on tab headers at the About.aspx page, but see no disabled tabs.
Do I need to perform any special action to reproduce this issue?
from ajaxcontroltoolkit.
@cristinadorotan To work around this issue, you can remove the ajax__tab_disabled
CSS class in the OnClientClick
event handler.
As this event occurs before the class is applied, a little timeout is required:
<script type="text/javascript">
function removeDisabledClass() {
var tabIDs = eval('<%= GetTabIDs()%>');
setTimeout(function() {
for(var i = 0; i < tabIDs.length; i++) {
var header = document.getElementById(tabIDs[i] + "_tab");
header.classList.remove("ajax__tab_disabled");
}
}, 50);
}
</script>
<ajaxToolkit:TabContainer ID="tab_Container" runat="server">
<ajaxToolkit:TabPanel ID="tb_A" HeaderText="OPTION_A" runat="server" OnClientClick="removeDisabledClass">
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="tb_B" HeaderText="OPTION_B" runat="server" OnClientClick="removeDisabledClass">
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="tb_C" HeaderText="OPTION_C" runat="server" OnClientClick="removeDisabledClass">
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="tb_D" HeaderText="OPTION_D" runat="server" OnClientClick="removeDisabledClass">
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
GetTabIDs
s a utility method that is used to get an array of header IDs.
I have attached the updated sample project AjaxControlToolkitTabIssueUpd.zip
from ajaxcontroltoolkit.
Thank you, how does this work when I want to disable a tab on purpose ?
from ajaxcontroltoolkit.
You need to exclude this tab from the class removal loop like this:
<script type="text/javascript">
var disabledTabIndex = 2; // can be set by external code
function removeDisabledClass() {
var tabIDs = eval('<%= GetTabIDs()%>');
setTimeout(function() {
for(var i = 0; i < tabIDs.length; i++) {
if(i === disabledTabIndex)
continue;
var header = document.getElementById(tabIDs[i] + "_tab");
header.classList.remove("ajax__tab_disabled");
}
}, 50);
}
</script>
...
<ajaxToolkit:TabPanel
ID="tb_C"
HeaderText="OPTION_C"
runat="server"
OnClientClick="removeDisabledClass"
Enabled="false" />
from ajaxcontroltoolkit.
Related Issues (20)
- CalendarExtender not displayed properly
- AjaxFileUploadHelper.Process(HttpContext context) Thrown Exception is not "Bubbling Up" Properly
- Sliderextender not working on touchscreen
- TabContainer Disappears - Uncaught TypeError: Cannot set property 'control' of undefined HOT 1
- Line graph rendering as a single horizontal line when deployed to server
- AjaxFileUpload failed to upload AI (Adobe Illustration) file?
- Cannot read properties of undefined (reading 'UI') on https
- Error "Could not find a part of the path 'C:\Windows\TEMP\_AjaxFileUpload" for file upload using AjaxFileUpload.
- Silent Install options missing
- Cannot edit right side of HTML Editor Extender
- AJAX Control Toolkit DevExpress Install Wizard will not install for Visual Studio 2022 HOT 2
- Backspace does not work for input with maskEditor
- Server tags in CSS
- AjaxFileUpload does not allow uploading of files with no extension
- Tab Container shows all tab panels messed is Visual studio 2019. HOT 1
- Facing Error in CalendarExtender of Ajaxtoolkit control while selecting a date
- MaskedEditExtender causes Application Error
- Create SECURITY.md
- Mono/Linux Compatible Issue - VS 2022 Issue
- AJAX Control Toolkit will not install in Visual Studio 2022
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ajaxcontroltoolkit.