CODEWITHSUNDEEP
javascriptjqueryhtml
Rahul
Rahul

Reputation: 380

Need help in jquery

I have following code:

<div id="comments" class="clearfix">
  <div class="conversation box_round_s box_shadow clearfix mtm">
  <div class="conversation box_round_s box_shadow clearfix mtm">
    <input class="conv_tracker" type="hidden" value="4695f1db2d">
    <div class="conv-header">2</div>
    <div class="comment pts plm prs pbs">
    <div class="comment plxl pts plm prs pbs">
    <div class="replybox pvs clearfix">
      <textarea class="comment_txt_r fses fft"></textarea>
    </div>
  </div>
  <div class="conversation box_round_s box_shadow clearfix mtm">
  <div class="conversation box_round_s box_shadow clearfix mtm">
</div>

and I'm trying to read the value of input with class conv_tracker (4th line in code with value="4695f1db2d"). I want to read this value. I'm reading it when someone presses enter in textarea. there are multiple text areas on page. I'm using following jquery:

the code does enter inside the if, but shows undefined.

$(".comment_txt_r").keydown(function(e){
  var code = (e.keyCode ? e.keyCode : e.which);
  if(code == 13) {      
    var ctext = $(this).val();
    var relid = $(this).closest('.conversation').children('input.conv_tracker').val();
    alert(relid);
  }
});

can anybody please tell me what I'm doing wrong?

Upvotes: -1

Views: 122

Answers (4)

iambriansreed
iambriansreed

Reputation: 22241

HTML

Replace <textarea class="comment_txt_r fses fft" />

With <textarea class="comment_txt_r fses fft"></textarea>

JavaScript

$('#comments .conversation').each(function(i, conversation){    
    $('.comment_txt_r', conversation).keydown(function(e){
      if((e.keyCode ? e.keyCode : e.which) == 13) {      
        var ctext = $(this).val();
        var relid = $('.conv_tracker', conversation).val();
        alert(relid);
      }
    });
    // additional per conversation code
});

By running through each conversation individually you give jQuery a smaller group of elements to filter through.

Upvotes: 0

user229044
user229044

Reputation: 239311

Use $('#conv_tracker').val(). The ID must be unique within the page, so there is no reason to traverse up and down the DOM via closest and children, and then select by ID. Just select by ID.

It's very likely that if your current code isn't working, the ID is not unique within the page, and it's being stripped off the later elements with duplicate IDs preventing your code from selecting the element. If this is the case, you need to use a class or some other attribute for the repeated elements.

As an unrelated suggestion, try using data attributes and attaching the value directly to the element you're binding the events to, rather than dumping random, uncoupled, semantically meaningless elements into the DOM.

Your text area gets a data-conv-tracker attribute:

<textarea class="comment_txt_r fses fft" data-conv-tracker="4695f1db2d" />

And your code is simplified drastically with no additional selection/DOM traversal:

if(code == 13) {      
  var ctext = $(this).val();
  var relid = $(this).data('conv-tracker');
  alert(relid);
}

Upvotes: 2

Jacob Tomlinson
Jacob Tomlinson

Reputation: 3773

Just address the input directly in jQuery like this $('#conv_tracker').val(). So your code would look like:

$(".comment_txt_r").keydown(function(e){
  var code = (e.keyCode ? e.keyCode : e.which);
  if(code == 13) {      
    var ctext = $(this).val();
    var relid = $('#conv_tracker').val();
    alert(relid);
  }
});

Upvotes: 0

Horen
Horen

Reputation: 11382

change the line 

var relid = $(this).closest('.conversation').children('input#conv_tracker').val();

to 

var relid = $('#conv_tracker').val()

You are using $(this) in the wrong context (it is $('.comment_txt_r') in your code)

Upvotes: 0

Related Questions