Question

I have some code like:

<input type="text" class="searchpersontxtbox" />
<input type="button" value="Find" class="findpersonbtn btn" disabled="disabled" />

There is a button click event:

$(document).ready(function () {

        $('.findpersonbtn').click(function () {

            var findpersonbutton = $(this);

            var searchbox = $(this).closest('.searchpersontxtbox');
            alert(show the searchbox text here);

        });
    });

So when the button is clicked I’m trying to get the text in the searchbox and alert it to the screen.

One point to note is that there could be multiple searchboxes on the page with ‘searchpersontxtbox’ class.

So I’m wanting to get the text from the textbox that is right above the button.

Can anyone help me here?

Answer 1

This isn’t how closest works. Without seeing the rest of your markup, one way to do this would be:

$(document).ready(function () {
    $('.findpersonbtn').click(function () {
        var findpersonbutton = $(this)
            , searchbox = $(this).prev();

        alert(searchbox.val());
    });
});

You can use prev to get the element right above the clicked .findpersonbtn.