Results 1 to 5 of 5

Thread: Show asterisk symbol with tab of a ExtJS TabPanel

  1. #1

    Default Answered: Show asterisk symbol with tab of a ExtJS TabPanel

    In following example Tab 1 has items which are all non-mandatory but Tab 2 has some mandatory/required items. While user is on Tab1, I want to be able to give user an indication of some required items in Tab 2 by showing an asterisk symbol in red color beside the title of Tab 2 i.e. Tab 2 *.

    What is a good practice of achieving that? I have seen numerous example of how to do it with basic fields (labels, combobox, textarea etc.) but nothing for tabs of a TabPanel.

    Code:
    {
      xtype: "tabpanel",
      plain: true,
      items: [{
          title: "Tab 1",
          items: this.buildItemsForTab1(),
          allowBlank: false,
      },
      {
          title: "Tab 2",
          items: this.buildItemsForTab2(),
          allowBlank: false,
      }]
    }

  2. this fiddle has one way of achieving it ... but maybe you want something better?

  3. #2
    Sencha Premium User
    Join Date
    Jun 2011
    Location
    Perth, Western Australia
    Posts
    182
    Answers
    10

    Default

    this fiddle has one way of achieving it ... but maybe you want something better?

  4. #3

    Default

    That should do for a start (if it works on my end too). I can improve it further by dynamically setting the title if a mandatory item exists in form. But for some reason this solution isn't working for me. I tried the same before posting this question and all I get in title after making such change is:

    'Tab 2 <Span Style="color: red;>*</Span>'

    i.e. the html doesn't reflect. It just gets dumped in the title.

  5. #4

    Default

    It seems like we have overridden working of some functions internally and that's why I am seeing this issue. Doesn't seem to be related to Ext 6.0.

  6. #5
    Sencha Premium User jvandemerwe's Avatar
    Join Date
    Apr 2009
    Location
    Raalte, Netherlands
    Posts
    260
    Answers
    7

    Default

    Maybe this gives you some thoughts on how to build further on the reply @fairport.


Similar Threads

  1. Replies: 1
    Last Post: 30 Jan 2015, 7:20 AM
  2. Need to show text name instead of collapsible symbol
    By arunmatics in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 3 Mar 2014, 6:58 AM
  3. Replies: 1
    Last Post: 27 Feb 2014, 10:30 AM
  4. Need to show text name instead of collapsible symbol
    By arunmatics in forum Sencha Touch 2.x: Q&A
    Replies: 0
    Last Post: 27 Feb 2014, 9:04 AM
  5. Replies: 1
    Last Post: 20 Oct 2011, 11:56 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •