Question

I am developing a web application in which the same HTML form is generated/loaded dynamically using AJAX.

Here is the sample form (almost 20 forms are loaded at a time):

<div class="replybox" id="rbox1">
    <cite>
        <form action="" method="post" id="replypostform">       
            <p>
                <textarea id="replytxt" name="replytxt" rows="2" cols="43" class="replytextarea"></textarea>
                <input class="button" type="submit" value="Reply"/>
            </p>    
        </form>
    </cite>
</div>

And I am using the jQuery validation plugin to validate them. The form validation works fine but now I just need to take the content of textarea upon submit, if I simply use .val() function then it will only return the first forms’ textarea content.

But I want the content of the textarea on which user clicked.

Here is my jquery validation code:

jQuery("#replypostform").live('mouseover', function(){
    jQuery(this).validate({
        errorElement:'div',
            rules: {
                replytxt:{
                    required: true
                }
            },
            messages: {
                replytxt:{
                    required: "<div style='color:red'>Please write a reply for posting it.</div>"
                }
            },
            submitHandler:function(mform){

            //here I want get the content of textarea
        }
    });
});

Here I just did a trick with mouseover event to validate the multiple form with same name/id and same fields.

My page loads around 20 exact same form using AJAX.

So suggest me how can I get the content of textarea of a particular form.

-Thanks

Answer 1

i tried this and it works

i know it’s not a correct way but this trick did the work

here is my jQuery code:

textBoxVal="";
        jQuery("#replytxt").live('keyup',function(){
        textBoxVal=jQuery(this).val();

        });

then in submitHandler()

i used “textBoxVal” values.