在“下拉”框中选择选项后,使用数组变量动态更新表单文本字段

时间:2013-03-10 17:28:46

标签: php javascript jquery drop-down-menu

我有一支有几支球队的梦幻棒球联盟,每支球队的名单上都有很多球员。所以,我有一个显示名单的页面。通过在下拉列表中选择术语,可以为名单上的每个玩家分配合同。然后我需要动态地在页面底部的文本字段中更新播放器的base_salary。一个团队可以选择多个玩家,所以我需要这个框来增加所选玩家的总薪水。当我只需要跟踪玩家是否处于合同状态时,我有一个复选框,我可以在复选框的值内传递玩家薪水,但现在有多种合约类型,因此下拉列表。所以,我的java函数仍然包含一些旧代码供参考....我无法计算如何传递并“跟踪”增量工资值,因为选择了下拉列表。工资从数据库获取并放在$ base_salary中。在此先感谢!!

到目前为止,这是我的代码(修订版)......

<form method='post' action='../keepers_updated' name='form1' id='form1'>
<select name='contracts[]' id='contracts' onchange='changeClass(this)'>
  <option value=>None</option>
  <option value=<php '$keeper'; ?> data-total=<php '$current_base_salary'; ?>Std.Keeper</option>
  <option value=<php '$contract_1'; ?> data-total=<php '$current_base_salary'; ?>>1</option>
  <option value=<php '$contract_3'; ?> data-total=<php '$current_base_salary'; ?>>3</option>
  <option value=<php '$contract_5'; ?> data-total=<php '$current_base_salary'; ?>>5</option>
  <option value=<php '$franchise'; ?> data-total=<php '$current_base_salary'; ?>>F Tag</option>
</select>
</td>
<td width='10px' align='center' ><php $current_teamID; ?></td>
<td width='60px' align='center' ><php $current_positionID; ?></td>
<td width='10px' align='center' width='10px' ><php $$current_base_salary; ?></td>
<td><input type='text' name='textfield' id='textfield' value=<php $$total_salary; ?> readonly />
<b>Total Keeper Salary</b></td>

<input type='hidden' name='TeamsID' value=<php $Teams_ID; ?>>
<input type='submit' value='Save keepers'>
</form>
</table>

我对java进行了一次尝试。我找到了一个在选项值标签中提到“数据”属性的帖子。不确定它是否适用于此,但我试过了......

function changeClass() {
  function recalculate() {
var elem=document.getElementById("textfield"); 
    var sum = 0;

    $('#contracts').find('option:selected').each(function() {
        sum += parseInt($(this).data("total"));
    });

    elem.value='$'+sum;
  }

  $('#contracts').change(ChangeClass() {
    recalculate();
  });

});
</script>

表单加载了所有合约选项,但文本字段不会更新任何内容。无论我在下拉菜单中选择什么,都要保持默认值。谢谢!

更新:确定....我发现我可以在select选项值字段中传递两个变量。我将契约类型和base_salary分隔为:像这样,(value = $ contract_1:$ base_salary)。我可以使用此代码来拆分值,它可以工作......

function changeClass(value) {
  var textfield;
  var select = document.getElementsByTagName('option');
  var value_parts = value.split(':');
  var count = select.length;
  document.getElementById('textfield').value = value_parts[1];
  return;
}

现在我遇到的麻烦是获得选择的总数,这样我就可以创建一个for循环来累积工资。

0 个答案:

没有答案