JEASYUI data-option max set to variable

Question

I am using JEASYUI for my forms. I have an edit form with a textbox (pqty) and I want to set its max attribute to the value of another textbox (sqty), but I don't know if it's possible. I know you can set it just by using specific number but I need the variable. Something like data-options="max:*sqty value here*?

<div class="fitem">
<label>PO Qty:</label>
<input name="pqty" class="easyui-numberbox" data-options="required:true, max:***">
</div>

<div class="fitem">
<label>SO Qty:</label>
<input type="hidden" name="sqty">
<input name="sqty" disabled>
</div>

Answer 1

Use the javascript method for creating a numberbox to redefine an existing numberbox with new parameters (http://www.jeasyui.com/documentation/index.php).

In the following demo you can set a new max value in SO Qty. Tabbing out will then change the settings for PO Qty, including reducing its value if it is higher than the new maximum.

$(function() {
  $("#sqty").on('change', function() {
  
    newMax = $(this).val() * 1; // * 1 makes it numeric rather than a string    
    
    $('#pqty').numberbox({
      max: newMax
    });
    
  });
});

<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<div id="me">
  <div class="fitem">
    <label>PO Qty:</label>
    <input id="pqty" name="pqty" class="easyui-numberbox" data-options="required:true, max:22">
  </div>

  <div class="fitem">
    <label>SO Qty:</label>
    <input id="sqty" name="sqty">
  </div>
</div>