jquery - Hide and Show one Record at Time -


i fetch of records , display each article 1 after other. off start last section#rest_of_profile hidden when user selects a#view_full_profile in first section want show 1 section in article not of them in each article. haven't been able find solution yet. closest have gotten showing them hiding 1 want show. appreciate help/advice can give.

var allrecords = $('section#rest_of_profile').hide();     $('a#view_full_profile').click(function(){         allrecords.slideup();         $(this).parent().next().slidedown();         return false;     });  <article class="searched-record"> <section>     <figure>         <img src="http://digitalhumanlibrary.com/wp-content/themes/thematicchild/images/profile/anonymous-search-profile.png" alt="member profile avatar">     </figure>     <nav class="member-social">         <ul>             <li><a href=""><span>&#102 </span></a>             </li>             <li><a href=""><span>&#108 </span></a>             </li>             <li><a href=""><span>&#116 </span></a>             </li>             <li><a class="member-skype" href=""></a>             </li>         </ul>     </nav> </section> <section>     <div><span>mebook: </span></div>     <div><span>contact name: </span></div>     <div><strong><span>country: </span></strong>     </div>     <div><strong><span>province/state: </span>'.$state.'</strong>     </div>     <div><strong><span>city: </span></strong>     </div>     <div><strong><span>time zone: </span></strong>     </div>     <div><strong><span>program focus: </span></strong>     </div>     <div><strong><span>occupation: </span></strong>     </div>     <div><strong><span>areas of expertise: </span></strong>     </div>     <div><strong><span>target audience: </span></strong>     </div>     <div><strong><span>video conferencing platforms: </span></strong>     </div>       <a id="view_full_profile" href="">view full profile</a>  </section> <section id="rest_of_profile">     <div><strong><span>email: </span><a href=""></a></strong>     </div>     <div><strong><span>phone: </span></strong>     </div>     <div><strong><span>website: </span></strong>     </div>     <div><strong><span>profile description: </span></strong>     </div>     <div><strong><span>profile learning goals : </span></strong>     </div>     <div><strong><span>curriculum links: </span></strong>     </div>     <div><strong><span>maximium # of students: </span></strong>     </div>     <div><strong><span>minimum # of students: </span></strong>     </div>     <div><strong><span>program format: </span></strong>     </div>     <div><strong><span>program length: </span></strong>     </div>     <div><strong><span>program cost: </span></strong>     </div>     <div><strong><span>technology specifications: </span></strong>     </div>     <div><strong><span>how register: </span></strong>     </div>     <div><strong><span>record: </span></strong>     </div>     <div><strong><span>cancellation policy: </span></strong>     </div>     <div><strong><span>who can contact me: </span></strong>     </div> </section> <footer></footer> </article> 

i figured out, had walk dom better. go target parent first select child wanted hide , show. interested see more efficient solution instead of repeating same code hide button, time being works beauty, here code.

/**********************************/     /*search profile functions*/ /**********************************/     $('section#rest_of_profile').hide();     $('a#hide_full_profile').hide();     //view full profile     $('a#view_full_profile').on('click',function(){         $(this).parent('article.searched-record').children('section#rest_of_profile').toggle('slow');         $('a#view_full_profile').hide();         $('a#hide_full_profile').show();     });     //hide full profile     $('a#hide_full_profile').on('click',function(){         $(this).parent('article.searched-record').children('section#rest_of_profile').toggle('slow');         $('a#view_full_profile').show();         $('a#hide_full_profile').hide();     }); 

Comments

Popular posts from this blog

c++ - OpenCV Error: Assertion failed <scn == 3 ::scn == 4> in unknown function, -

php - render data via PDO::FETCH_FUNC vs loop -

The canvas has been tainted by cross-origin data in chrome only -