Question

I have a page which contain a bunch of text area generated by a PHP script. There is a hidden input type that contains an id of a variable. Basically what I want to do is to call the .ajax() JQuery method on .blur() on any of the text areas and pass the value of the textarea + the id from the hidden input.
All of my text areas are named like this: tr1,tr2,tr3,etc. And the hidden fields:tr_id1,tr_id2,etc

So how can I get the value from both elements so I can use them somewhere else?

Answer 1

This may give you an idea

HTML

<textarea name="tr1"></textarea>
<input type="hidden" name="tr_id1" value="1" />
<br />
<textarea name="tr2"></textarea>
<input type="hidden" name="tr_id2" value="2"/>

​
JS

​$(function(){
    $('textarea').on('blur', function(e){
        var txtAval=$(this).val();
        var txtId=$(this).prop('name').replace('tr','');
        var txtHval=$('input:hidden[name="tr_id'+txtId+'"]').val();

        // txtAval contains textarea's value and txtHval contains text input's value

       $.ajax({
           type: "POST",
           url: "some_url",
           data: {txtarea:txtAval, txthidden:txtId}
          //or
          //data: "txtarea="+txtAval+"&txthidden="+txtId
        }).done(function(msg) {
            // ...
        });
    });
});​

jQuery ajax reference: Here.

See the values on the console here.