how to access preciding element value of (this) element? jquery is only saving strategy_id

This is a small jquery code :

 $('.form-check-input').bind('change', function () {
        var data = {
            'strategy_id': jQuery(this).val(),
            'customer_instruments_id':jQuery(this).prev().find('input').val(),
            'status': (this.checked == true) ? 'Yes' : 'No'
         };

my html/php:

<div class="d-flex flex-column mb-5">
    @foreach ($strategies as $str )
      <div class="form-check check-quinary form-switch">
           <input  type="hidden" name="customer_instrument_id" value={{ $instrument['instrument_id'] }}>
           <input class="form-check-input" type="checkbox"  id="flexSwitchCheckChecked" 
                 name="strategy_id" value="{{ $str->id }}">
            <label class="form-check-label" for="flexSwitchCheckChecked">{{ $str->name }}</label>
         </div>
      @endforeach
 </div>

ramonrietdijk

3 years ago

Level 30

Since your <input> elements are siblings, using the prev() method is enough.

jQuery(this).prev().val()

By using .prev().find('input') you are searching for an <input> within an <input>.

Alternatively, the parent() method will also work.

jQuery(this).parent().find('input').val()

However, I'd strongly recommend fetching the values by their name attribute as your HTML-layout may change in the future - breaking the JavaScript.

Please or to participate in this conversation.