C1tabs client onclick from tab, not tab body

Posted by: kevin.rowe on 26 October 2020, 11:08 pm EST

    • Post Options:
    • Link

    Posted 26 October 2020, 11:08 pm EST

    
    <%@ Register assembly="C1.Web.Wijmo.Controls.4" namespace="C1.Web.Wijmo.Controls.C1Tabs" tagprefix="wijmo" %>
    ...
    <script type="text/javascript" id="validation">
    ...
            function SetFilterText() {
                var lsFilter = null;
    ...
                if (rbllist[3].checked)
                { //FILTER_FIRST:
                    if (<%= FOTabStrip1.ClientID%>) {
                        var lilist = $('[id="<%= FOTabStrip1.ClientID%>"]').find("li");
                        var lichecked = lilist.find(x => x.checked === true);
                        if (lichecked.length != 0) {
                            lsFilter = "Product description starts with '" + lichecked[0].text + "'";
                            }
                        else {
                            lsFilter = "Product description starts with (any)";
                            }
                        }
                        
                }
                <%= lblFilterDesc.ClientID%>.Text = lsFilter;
            }
        </script>
     ...               
                <div runat="server" id="divtabstrip" style="width: 80%; padding: 10%; height: 30%;float:left; ">
                                    <wijmo:C1Tabs ID="FOTabStrip1" AutoPostBack="false" runat="server" OnClientSelect="SetFilterText()" OnSelectedChanged="FOTabStrip1_SelectionChanged" Height="100%" Width="100%">
                                        <Pages>
                                            <wijmo:C1TabPage ID="C1Tabs1_A" runat="server" StaticKey="a" Text="A" >
                                            </wijmo:C1TabPage>
                                            <wijmo:C1TabPage ID="C1Tabs1_B" runat="server" StaticKey="b" Text="B">
                                            </wijmo:C1TabPage> 
    ...
                                            </wijmo:C1TabPage>
                                        </Pages>
                                    </wijmo:C1Tabs>
                                </div>
                                <div runat="server" id="filterdesc" style="width: 100%; height: 20%; float: left">
                                    <div class="brownlabel2" style="width: 80%;">
                                        <div style="width:100%;height:15%"></div>
                                        Current Filter: <asp:label runat="server" ID="lblFilterDesc" Text="" />
                                    </div>
                                </div>
    
    

    The setFilterText() javascript function is only being run at page load. I’ve tried to manually add onclick events to the tabs but it adds click to the tab body not the index header (these are all that is visible).

    How can I add a client side event to the tab header so that when it gets clicked i can change the label filter text to "Filter starts with (tabtext) "

    I can’t find any documentation for client side onclick events.

    this is wijmo 4.0.20201.326 in studio 2017.

    any help appreciated.

  • Posted 27 October 2020, 11:11 pm EST

    Hi Kevin,

    The OnClientSelect event is correct event for you requirement. The reason that it is not being triggered, you added () with the event handler.

    Hence the updated code would be as follows:

     <wijmo:C1Tabs ID="FOTabStrip1" AutoPostBack="false" runat="server" OnClientSelect="SetFilterText">
    

    Please also refer to the attached sample for reference.

    Also, please post any queries related C1 WebForms control at our C1 WebForms control forum here:

    https://www.grapecity.com/forums/webforms-edition

    Regrads,

    Manish Gupta

    C1TabPanel-ClientSelect.zip

  • Posted 28 October 2020, 4:31 am EST

    Thanks.

    It now works perfectly.

    I’ll post my comments about finding documentation in the webforms forum.

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels