Question

I have list of elements and when I choose element from list, "value" from code below are changing.

    <div class="drop-down-cont zi-5 fleft">
          <input class="dd-input" id="packaging_item_packaging_name" name="packaging_item[packaging_name]" title="Packaging Type" type="hidden" value="PX">
          <a class="drop-down-link item-qnt" href="#" id="packaging_item_packaging_name_link">Pallet</a>
          <div class="drop-down pic" style="visibility: visible; ">
            <div class="blue-tarr"></div>
            <div class="drop-down-list-cont w400">
              <div class="drop-down-list first pt-cases w100p" id="cases_results_"><ul class="w100p">
  
<li id="PX" class="selected">
  <a href="javascript:void(0)">Pallet</a>
</li>
<li id="PB">
  <a href="javascript:void(0)">Pallet Box</a>
</li>
<li id="PLP">
  <a href="javascript:void(0)">Peel pack</a>
</li>
    
</ul>



</div>
              <div class="pic-cont h100p"><img alt="Package Image" src="/images/pi_new/32.jpg?1312107854"> </div>
            </div>
            <div class="remark">
A platform used to hold or transport unit loads. 

</div>
            <a class="submit-btn2 pt-choose-btn-" href="javascript:void(0)" id="pack_apply">Apply</a>
          </div>
        </div>

<table id="pallet_table" style="display:none;">
    <tbody>
      <tr>
        <td>
          stacking factor:
        </td>
        <td>
          <input class="w44" id="packaging_item_stacking_factor" name="packaging_item[stacking_factor]" size="30" type="text" value="1">
        </td>
      </tr>
    </tbody>
  </table>

I want to show table when I choose ‘value’ to ‘PX’ and execute this script,

if ($('.dd-input').attr('value') == 'PX') {
    $('#pallet_table').show();}

but this doesn’t work dynamically. How I can handle this event then I change value from ‘smth’ to ‘PX’

Answer 1

This should solve your problem (see this jsfiddle):

jQuery('.dd-input').bind('change', function(){
    if (jQuery(this).val() == 'PX'){
        // do here whatever you need
        $('#pallet_table').show();
    }
});

I do not see however, how you would like the user to change the value of this field (in your code the field is hidden). If this is done through a different script, maybe the current approach is not the best one and you should call some function explicitly instead of doing it when the value is changed?