javascript - Showing Overall Description on button click -


i have ui more 3 div's there has data's different ids common button called "read".i have displayed messages in have kept message body tiny(15) on read button show me entire body of message.how achieve 1 way trying follows:

foreach (var item in model.mynote)     {      <div class="row">         @if (item.owner.roles.any(cx => cx.rolename == "customer"))         {             <div class="panel">                 <div class="row">                     <div class="three columns">                         <img src="@request.url.formatabsoluteurl(@item.owner.personal.imageurl)" />                         <span style="text-align: center;">                             @item.owner.personal.firstname  @item.owner.personal.lastname                         </span>                     </div>                     <div class="nine columns">                         <input type="hidden" value="@item.id" id="messid" />                         <p class="parahide1">@item.description </p>                         <p class="parahide">@item.description.totiny(15) </p>                     </div>                     @*<a href="@url.action("read", "appointment", new { @id = item.id })" class="button" id="read">read</a>*@                     <button class="button" id="read">read</button>                  </div>             </div>         }         else if (item.owner.roles.any(cx => cx.rolename == "professional"))         {              <div class="panel">                 <div class="row">                     <div class="nine columns">                         <p>@item.description </p>                     </div>                     <div class="three columns">                         <img src="@request.url.formatabsoluteurl(@item.owner.professional.imageurl)" />                         <span style="text-align: center;">@item.owner.professional.companyname</span>                     </div>                 </div>                 <a href="@url.action("read", "appointment", new { @id = item.id })" class="button">read</a>             </div>                                                           }     </div>        <script type="text/javascript">     $(function () {         $(".parahide1").hide();         $("#read").live('click',function () {             $(".parahide").hide();             $(".parahide1").show();         });     }); </script>      } 

this give the result showing description of div's if click on button of first div.

try finding classes in parent of current button -

$(function () {     $(".parahide1").hide();     $("#read").on('click',function () {         $(this).parent().find(".parahide").hide();         $(this).parent().find(".parahide1").show();     }); }); 

hence, divs present in current button's parent hidden or shown!

more on .parent() , .find()

also use .on() instead of .live() live has been deprecated.


Comments

Popular posts from this blog

c++ - CryptStringToBinary API behavior -

c++ - Correct method for redrawing a layered window -

java.util.scanner - How to read and add only numbers to array from a text file -