使用Dropdown填充文本框并将多个变量传递给表单(javascript)

时间:2016-07-27 13:17:41

标签: javascript php codeigniter

我有一个Dropdown菜单,其中包含来自数据库的用户名。我想在选择名称时将用户余额填充到其下方的文本框中。我能够使用以下代码将当前下拉值传递给下面的文本框,但我需要能够保持下拉值(user_id)的值以传递给表单。我知道很少的javascript;希望有人能帮助我。

感谢。

function set_to(id)
{
$('#private_list').val(id);

}


<div class="wrapper container">
<div class="row">
<div id="loginbox" class="mainbox col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3">
<div class="panel panel-default" >
  <div class="panel-heading">
    <div class="panel-title text-center"><strong>Adjust Balance</strong>       </div>
  </div>
  <div class="panel-body" >
    <form action="adjust_balance" name="adjust_balance" id="login-form" class="form-horizontal" enctype="multipart/form-data" method="POST">

  <option value="" disabled selected>Select User Name</option>
      <div class="input-group">
      <span class="input-group-addon"><i class="fa fa-user"></i></span> 
      <select class="form-control" name="id" onchange="javascript:set_to(this.value);"">
        <?php
         foreach($users as $row){
          echo '<option value="'.$row->id.'">'.$row->first_name.' '.$row->last_name.'</option>';
        }
        ?>                          


      </select>
</div>

<div class="input-group">
        <span class="input-group-addon"><i class="fa fa-usd"></i></span>
        <input id="private_list" type="text" id="private_list" name="balance" class="form-control" name="balance" value="" placeholder="Balance">
      </div>       
<br>
<br>

      <div class="form-group">
        <!-- Button -->
        <div class="col-sm-12 controls">
        <!--<button type="submit" href="#private_list" class="btn btn-success pull-left"><i class="fa fa-upload"></i> Load List</button>-->
          <button type="submit" href="#" class="btn btn-success pull-right">   <i class="fa fa-upload"></i> Update User Balance</button>
        </div>
      </div>
    </form>
  </div>
</div>
</div>
</div>

2 个答案:

答案 0 :(得分:0)

你必须在数据中使用user-id向你的控制器发送一个ajax请求。在服务器端,你将获得这个用户id并进行查询,这将为你提供针对该用户所需的结果。现在你需要填充在选择选项中记录并回显它们。您将在成功数据中获得这些选项。然后,您只需将这些选项放入选择中。

 $('#select-id').change(function (){

    var select-value=$('#select-id').val();
        $.ajax({
            url:"url-of-controller",
            data:{user-id:select-value},
            type:"get",
            success:function (data){
               $("#target-select").html(data);
            },
            error:function (err){
               alert(err);
            }



        });

    });

答案 1 :(得分:0)

我能够使用它;可能不是最好的解决方案,但我已经编写了大约一个星期,但它确实有效。

$('#userbalanceselector').on('change', function () {
var val = this.value;
var parts = val.split("_");
$('#balance').val(parts[0]);
$('#user_id').val(parts[1]);
});