Click here to Skip to main content
15,914,419 members
Home / Discussions / JavaScript
   

JavaScript

 
Questione.target.value, switch-case operators Pin
ghazabaz6-Dec-18 19:22
ghazabaz6-Dec-18 19:22 
QuestionRe: e.target.value, switch-case operators Pin
Richard MacCutchan6-Dec-18 23:26
mveRichard MacCutchan6-Dec-18 23:26 
QuestionRe: e.target.value, switch-case operators Pin
ghazabaz7-Dec-18 3:47
ghazabaz7-Dec-18 3:47 
AnswerRe: e.target.value, switch-case operators Pin
Richard MacCutchan7-Dec-18 4:29
mveRichard MacCutchan7-Dec-18 4:29 
AnswerRe: e.target.value, switch-case operators Pin
Richard Deeming7-Dec-18 5:37
mveRichard Deeming7-Dec-18 5:37 
QuestionRe: e.target.value, switch-case operators Pin
ghazabaz7-Dec-18 6:44
ghazabaz7-Dec-18 6:44 
AnswerRe: e.target.value, switch-case operators Pin
Richard Deeming7-Dec-18 6:51
mveRichard Deeming7-Dec-18 6:51 
AnswerRe: e.target.value, switch-case operators Pin
Richard Deeming7-Dec-18 6:54
mveRichard Deeming7-Dec-18 6:54 
QuestionRe: e.target.value, switch-case operators Pin
ghazabaz8-Dec-18 5:19
ghazabaz8-Dec-18 5:19 
AnswerRe: e.target.value, switch-case operators Pin
Richard Deeming11-Dec-18 1:16
mveRichard Deeming11-Dec-18 1:16 
PraiseRe: e.target.value, switch-case operators Pin
ghazabaz13-Dec-18 6:05
ghazabaz13-Dec-18 6:05 
QuestionEasy HTML Editor Pin
Bram van Kampen3-Dec-18 15:23
Bram van Kampen3-Dec-18 15:23 
AnswerRe: Easy HTML Editor Pin
Nathan Minier6-Dec-18 1:24
professionalNathan Minier6-Dec-18 1:24 
AnswerRe: Easy HTML Editor Pin
Nitin S7-Dec-18 1:57
professionalNitin S7-Dec-18 1:57 
AnswerRe: Easy HTML Editor Pin
RedDk28-Dec-18 11:44
RedDk28-Dec-18 11:44 
GeneralRe: Easy HTML Editor Pin
Bram van Kampen28-Dec-18 12:55
Bram van Kampen28-Dec-18 12:55 
QuestionProblems to obtain value "0" or "1" from a div Pin
serenimus1-Dec-18 0:37
serenimus1-Dec-18 0:37 
AnswerRe: Problems to obtain value "0" or "1" from a div Pin
ZurdoDev4-Dec-18 2:27
professionalZurdoDev4-Dec-18 2:27 
QuestionUnable to switch events in jquery Pin
vmann30-Nov-18 18:45
vmann30-Nov-18 18:45 
I have some sort of similar markup as shown in last.

I want to filter the inner text elements based upon ids innerfilter1, innerfilter2.

I have also written code for hide general content based upon the outer filter. i.e. myid1 and myid2 which works fine. Here ids will hide divs have same classes

JavaScript
$('ul.nav.nav-tabs>li>a').click(function(){
    var curtab = $(this).attr('href').substring(1);
      console.log(curtab);
    $('.tab-content .tab-pane').each(function(){
      var tabid = this.className;
      if(tabid.indexOf(curtab) > -1){
        $(this).siblings().hide();
      }
    });
    $(this).show();
  });

});

But nested filters use to filter the content which is not general but having filter either innerfilter1, innerfilter2. I have tried below code but this effects other tabs as well also impact

JavaScript
$('div.inner-tab-box>ul.nav.nav-tabs>li>a').click(function(){
    var curtab = $(this).attr('href').substring(1);
    $('.tab-content .tab-pane').each(function(){
      var tabid = this.id;
      if(tabid.indexOf(curtab) > -1){
        $(this).siblings().each( function () {
            var tx=this.id;
            if(tx==='general') {
            } else {
               $(this).hide();
            }
        });
        $(this).show();
      }
    }); 
});

Full Markup
JavaScript
<div class="top-header">
   <div class="container-fluid">
      <div class="header-top">
         <!-- Tabs -->
         <div id="tabs">

            <!-- tabs start  -->
            <div class="tab-content">
               <!-- part 1 Will execute 2 times as  per filters-->
               <div role="tabpanel" class="tab-pane active" id="myid1">
                  <div class="row">
                     <div class="col-xs-5ths ">
                        <div class="dark-box-outer">
                           <div class="top-light-text-box">
                              <div class="inner-tab-box ">
                                 <ul class="nav nav-tabs" role="tablist">
                                    <li role="presentation" class=""><a href="#innerfilter1" aria-controls="home" role="tab" data-toggle="tab">></a></li>
                                    <li role="presentation" class=""><a href="#innerfilter2" aria-controls="profile" role="tab" data-toggle="tab"></a></li>
                                 </ul>
                                 [B]<div class="tab-content">
                                    <div role="tabpanel" class="tab-pane myid1 " id="innerfilter1">
                                       <ul>
                                          <li>
                                            /* Some Content */
                                          </li>
                                       </ul>
                                    </div>
                                    <div role="tabpanel" class="tab-pane myid1 " id="innerfilter2">
                                       <ul>
                                          <li>
                                          /* Some Content */
                                          </li>
                                       </ul>
                                    </div>
                                    <div role="tabpanel" class="tab-pane myid1 " id="general">
                                       <ul>
                                          <li>
                                          /* Some Content */
                                          </li>
                                       </ul>
                                    </div>
                                    <div role="tabpanel" class="tab-pane myId2 " id="general">
                                       <ul>
                                          <li>
                                          /* Some Content */
                                          </li>
                                       </ul>
                                    </div>[/B]
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xs-5ths ">   
                        <!-- Repeated Markup   -->             
                     </div>
                     <div class="col-xs-5ths ">  
                        <!-- Repeated Markup   -->                                 
                     </div>
                     <div class="col-xs-5ths ">
                            <!-- Repeated Markup   -->                                
                     </div>
                     <div class="col-xs-5ths ">

                     </div>
                  </div>
               </div>
               <!-- end part 1 -->
               <div role="tabpanel" class="tab-pane " id="myId2">
                <!--Repeated Content For myId2-->
               </div>
               <!-- end part 1 -->
            </div>
            <!-- End part 2 -->
         </div>
      </div>
      <!-- ./Tabs -->
   </div>
</div>

Can anyone help me to fix this.

Thanks
SuggestionRe: Unable to switch events in jquery Pin
ZurdoDev4-Dec-18 2:28
professionalZurdoDev4-Dec-18 2:28 
QuestionError on line 45 Pin
ghazabaz30-Nov-18 13:38
ghazabaz30-Nov-18 13:38 
AnswerRe: Error on line 45 Pin
ZurdoDev4-Dec-18 2:29
professionalZurdoDev4-Dec-18 2:29 
AnswerRe: Error on line 45 Pin
maryam.saboor4-Dec-18 23:54
professionalmaryam.saboor4-Dec-18 23:54 
Questiondata transfer in two dimensional array format Pin
Member 1406088822-Nov-18 20:31
Member 1406088822-Nov-18 20:31 
QuestionRe: data transfer in two dimensional array format Pin
ZurdoDev4-Dec-18 2:29
professionalZurdoDev4-Dec-18 2:29 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.