Remove Space at the end of webtab | Infragistics Forums

505

Remove Space at the end of webtab

ananda posted over 8 years ago

Hi,

I need to remove the last extra space on the webtab which is shown below. I am using version 14.2

https://s31.postimg.org/xvv3dw6fv/forum.png

15320

Offline [Infragistics]Tsanna posted over 8 years ago in reply to ananda

Hello Tct_Anand,

As Deyan suggested you may change the tabs width every time a new tab is added on TabAdded event, so that the sum of all tabs should be 100%. How you will do the tabs width calculations is up to you. If I can provide you with further assistance, please let me know.

Regards,
Tsanna
Cancel
Reply

Cancel
15320

Offline [Infragistics]Tsanna posted over 8 years ago in reply to ananda

Hi Tct_Anand,

I'm looking into this and will keep you posted. If you have any questions at the meantime, please let me know.

Regards,
Tsanna
Cancel
Reply

Cancel
505

ananda posted over 8 years ago in reply to Deyan Kamburov

Hi,

I already told you that the tabs are not fixed on design time. Currently it is having 10 tab items. In future it may increase or decrease. So all the time i cannot modify the design and modify the width %.
Cancel
Reply

Cancel
3995

Offline Deyan Kamburov posted over 8 years ago in reply to ananda

Well, I'll suggest once the WebTab is loaded to set the width of each tab to be in percentages and the sum of them should be 100%

<script type="text/javascript">
  function WebTab1_Loaded(sender, eventArgs) {
   var tabs = sender.get_tabs();
   for(var tab in tabs) {
    tabs[tab]._elem.style.width = "10%";
   }
  }
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div style

     <ig:WebScriptManager ID="WebScriptManager1" runat="server">
  </ig:WebScriptManager>
  <ig:WebTab ID="WebTab1" runat="server" Height="189px" SelectedIndex="3" DisplayMode="MultiRowAuto" Width="100%">
   <ClientEvents Loaded="WebTab1_Loaded" />
  <PostBackOptions EnableReloadingUnselectedTab="true" EnableAjax="true" EnableLoadOnDemand="false" EnableReloadingOnTabClick="true" />
  <tabs>
  <ig:ContentTabItem runat="server" Text="Employees">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Shifts">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Rework Reasons">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Partnumbers">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Customers">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Machines">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Actions">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Qualification Types">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Qualification">
  </ig:ContentTabItem>
  <ig:ContentTabItem runat="server" Text="Routes">
  </ig:ContentTabItem>

  </tabs>
  </ig:WebTab>

    </div>
    </form>
</body>
</html>
Cancel
Reply

Cancel
505

ananda posted over 8 years ago in reply to Deyan Kamburov

Hi,

Ok now it seems to be ok. But i want this webtab to be 100% width of the browser but it is now not showing till the right corner of the page. I am attaching it below.

i want the tab to be till the right side of the browser. How can i do that? please suggest any idea....
Cancel
Reply

Cancel