CODEWITHSUNDEEP
javascriptjqueryhtml
eclipsis
eclipsis

Reputation: 1550

Click button to get value from nearby input?

I have a button that comes after an input in the HTML, and I want to use that button to retrieve the value from that input and perform an action. The problem I'm facing is that my jQuery isn't finding that value.

The HTML:

<div>
    <input class="an-input" type="text"></input>
    <button class="ui-state-default inputButton an-button">GO</button>
</div>

The JS:

$('.an-button').click(function() {
    var inputValue = $('.an-button').prev('.an-input').find('input').val();
    window.open('http://a810-bisweb.nyc.gov/bisweb/JobsQueryByNumberServlet?passjobnumber='+inputValue+'&passdocnumber=&go10=+GO+&requestid=0');
});

Upvotes: 0

Views: 77

Answers (5)

Jose
Jose

Reputation: 1

The input element has not end tag

more information here

the correct is <input />

Upvotes: 0

guest271314
guest271314

Reputation: 1

Try removing .find('input') , as .prev(".an-input") should return input element . Also note, <input /> tag is self-closing

$(".an-button").click(function() {
    var inputValue = $(this).prev(".an-input").val();
    console.log(inputValue)
    //window.open('http://a810-bisweb.nyc.gov/bisweb/JobsQueryByNumberServlet?passjobnumber='+inputValue+'&passdocnumber=&go10=+GO+&requestid=0');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div>
    <input class="an-input" type="text" />
    <button class="ui-state-default inputButton an-button">GO</button>
</div>

Upvotes: 2

Ramanlfc
Ramanlfc

Reputation: 8354

$('button.an-button').click(function() {
    var inputValue = $('.an-input:text').val();
  ... rest of code
})

Upvotes: 0

Korgrue
Korgrue

Reputation: 3478

To target a sibling, it must be of similar type.

Try this instead:

$('.an-button').click(function() {
    var inputValue = $('.an-button').parent().find('.an-input').val();
    window.open('http://a810-bisweb.nyc.gov/bisweb/JobsQueryByNumberServlet?passjobnumber='+inputValue+'&passdocnumber=&go10=+GO+&requestid=0');
});

Upvotes: 0

Cory
Cory

Reputation: 1283

Travel up the DOM with closest:

 var inputValue = $('.an-button').closest('div').find('input').val();

Fiddle

Upvotes: 2

Related Questions