CODEWITHSUNDEEP
jquery
Paramasivan
Paramasivan

Reputation: 791

jQuery toggle div and toggle text

I want to make the link "Add additional comment" when clicked to show a text area and the text to toggle as "Remove comment". When "Remove comment" is clicked it should hide text area and the text need to change as "Add additional comment".

The code I used is

<script type="text/javascript">
$(document).ready(function( ){
$("#addcmt").click(function( )
{
$(".commentarea").toggle( );
if ($("#addcmt").text = "Add additional comment") {
     $("#addcmt").text("Remove comment");
  }
else {
   $("#addcmt").text("Add additional comment");
 }
});
});
</script>

The html is

<div class="addlcomment">
  <a id="addcmt">Add additional comment</a>
 </div>
 <div class="commentarea" style="display:none;">
     <textarea name="strcomments1" tabindex="2"></textarea>
 </div>

The text toggle is not working.

Any help is appreciated.

Upvotes: 2

Views: 11752

Answers (5)

voigtan
voigtan

Reputation: 9031

if you want to check if the block is visible to change the text:

$(document).ready(function() {
    $("#addcmt").click(function() {
        var isVisible = $(".commentarea").toggle().is(":visible");
        $(this).text( isVisible ? "Remove comment" : "Add additional comment");
    });
});

Im using this because you already looked up #addcmt once no need really to find that element once again.

Upvotes: 5

Kieran
Kieran

Reputation: 6196

You are doing an assignment rather than a comparison in this line:

    if ($("#addcmt").text = "Add additional comment") {

You want this instead:

    if ($("#addcmt").text == "Add additional comment") {

Upvotes: 0

Panos Bariamis
Panos Bariamis

Reputation: 4653

Your if is wrong. Replace 

if ($("#addcmt").text = "Add additional comment")

with

if ($("#addcmt").text == "Add additional comment")

Upvotes: 0

WojtekT
WojtekT

Reputation: 4775

You have an error in line:

if ($("#addcmt").text = "Add additional comment") {

Should be:

if ($("#addcmt").text() == "Add additional comment") {

Upvotes: 0

Tats_innit
Tats_innit

Reputation: 34117

working demo http://jsfiddle.net/eDNH5/10/

This will help you!

the issue was you were using the assignment operator instead of equality ==

Jquery code

$(document).ready(function() {
    $("#addcmt").click(function() {
        $(".commentarea").toggle();
        if ($("#addcmt").text() == "Add additional comment") {
            $("#addcmt").text("Remove comment");
        }
        else {
            $("#addcmt").text("Add additional comment");
        }
    });
});​

Upvotes: 6

Related Questions