0

I am creating a jQuery function in which I am using one class for a button that is common in second div's button too. my html markup is 

  <div class="micmstabs miindex">
     <h4>Manage Your Index Page Here</h4>
        <textarea  class="redactor_content" name="content" rows="4"><?php cms_html('index'); ?></textarea> 
         <a href="#" data-dismiss="modal" class="cms_s index_save btn btn-primary">Save Changes</a>  
  </div>

  <div class="micmstabs miterms">
     <h4>Manage Your Terms & Conditions Page Here</h4>
        <textarea  class="redactor_content" name="content" rows="4"><?php cms_html('terms'); ?></textarea> 
         <a href="#" data-dismiss="modal" class="cms_s terms_save btn btn-primary">Save Changes</a>
  </div>

In the above when we click on cms_s i try to get value of textarea based on a condition check in jQuery that if this button has this class then get me value of the textarea of div in which this button and the textarea is.

My jQuery function is 

$(document).on('click', '.cms_s', function(event) {
        if ($(this).hasClass('index_save')) {
            var cms_page='index';
            }
        if ($(this).hasClass('terms_save')) {
            var cms_page='terms';
            }   
        if ($(this).hasClass('policy_save')) {
            var cms_page='policy';
            }
        if ($(this).hasClass('mem_save')) {
            var cms_page='membership';
            }
            alert(cms_page);
            var cms_html=$(this).parents("div").find('.redactor_content').val();
            alert(cms_html);


});

I am able to get the condition check for the class perfectly . But when i try to get the value of textarea based on the button i clicked no matter what button i click it gets me the value of the textarea present in the first div markup.

Improve this question
1
  • The original code worked for me as provided. I think the actually issue is probably that there's another parent div, further up the DOM, that contains a redactor_content and that is getting returned, not the sibling shown in the example (since parents() will search all the way up the DOM for all divs). I bet switching to the singular .parent() would also address the issue. Commented Apr 22, 2013 at 20:03

2 Answers 2

Reset to default
3

If you pres on the button and you want the previous textbox value. It's easier to do this:

$(document).on('click', '.cms_s', function(event) {
     var val = $(this).prev("textbox").val();
     // Or within the same level
     val = $(this).parent().find("textbox").val();
     val = $(this).siblings("textarea").val();
});

You problem occurs when because all the inputs have the class redactor_content so the .val() will get the first textarea in the array and get that value. Which is allways the first redactor_content.

var cms_html=$(this).parents("div").find('.redactor_content').val();
Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

no what i meant is i am getting the value of the prev textarea i want that when i click on any of the button i get the value of that textarea which in inside the same div as of the button i clicked
lol this also worked i voted up you too :) btw @Niels thank you for the detailed explanation
The original code worked for me as provided. I think the actually issue is probably that there's another parent div, further up the DOM, that contains a redactor_content and that is getting returned, not the sibling shown in the example (since parents() will search all the way up the DOM for all divs)
1

Try this -

var cms_html=$(this).closest("div").find('.redactor_content').val();
Improve this answer

1 Comment

thanks a lot @Mohammad Adil this worked perfect and just on time now i can make one ajax call for different textarea :)

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.