Question

这是我在数据库中的表

tbl_job_title

ID | Job_title    | description     | 
1  | Accountant   | Handle Accounts |
2  | Dev. Support | Support Centre  |

从表格中选择职位时，我正在使用下拉菜单，这是我的代码。

<select id="job_title" >
   <option value=""> </option>
     <?php foreach ($job_title as $row): ?>
       <option value="<?php echo $row['id']; ?>"><?php echo $row['title']; ?>
       </option>
     <?php endforeach?>
</select>

我有一个文本框，如果我选择一个job_title

将填充

<input type="text" id="catch_value">

当我选择示例为“会计”时，如何填充文本框，文本框值必须为“处理帐户”。

Answer 1

这是短片＆amp;我为你做的甜蜜代码，随意使用它！不需要Ajax ......

代码 -

<select id="job_title" >
   <option value="" class="job" role=""> </option>
     <?php foreach ($job_title as $row): ?>
       <option value="<?php echo $row['id']; ?>" class="job<?php echo $row['id']; ?>" role="<?php echo $row['description']; ?>"><?php echo $row['title']; ?>
       </option>
     <?php endforeach?>
</select>

Jquery -

$('#job_title').on('change',function(){
    var m = this.value;
    var n = $('.job'+m).attr('role');
    $('#catch_value').val(n);
    return false;
});

例如 - fiddle

Answer 2

<select id="job_title" onchange="javascript:callajaxvalue(this.value);">
   <option value=""> </option>
     <?php foreach ($job_title as $row): ?>
       <option value="<?php echo $row['id']; ?>"><?php echo $row['title']; ?>
       </option>
     <?php endforeach?>
</select>

<script>
    function callajaxvalue(id)
    {
          $.ajax({
           type: "POST",
           url: "some.php",
           data: { id: id}
            success: function(data, textStatus ){
                if(data)
                { $("#catch_value").val(data);}
            },
          })
    }
</script>

<强> some.php

$ _ POST [ 'ID'];

$ query =“从表中获取数据”;

执行查询。

echo $ row ['description'];

对于codeigniter

function callajaxvalue(id)
    {
          $.ajax({
           type: "POST",
           url: "my_controller/update/"+id,
           data: { id: id}
            success: function(data, textStatus ){
                if(data)
                { $("#catch_value").val(data);}
            },
          })
    }

<强> my_Controller.php

    public function update()
    {
        $id = $this->input->post('id');
        $data['discription'] = call model function for get data form database

        echo json_encode($data);
    }

Answer 3

这是正确答案：

    <select id="job_title" onchange='populate()'>
   <option value=""> </option>
    <?php foreach ($job_title as $row): ?>
    <option value="<?php echo $row['id']; ?>"><?php echo $row['title']; ?>
   </option>
 <?php endforeach?>
  </select>

   <script>
       function populate(){
        var jobttl= document.getElementById('job_title').value();
        if(jobttl){
          document.getElementById('catch_value').value;
        }

        }
   </script>

Answer 4

 $('#job_title').change(function(){
  $('#catch_value').val('Handle Accounts');
 });

请参阅小提琴：fiddle

或者您可以添加if语句

 $('#job_title').change(function(){
    var jt = $('#job_title').val();
if(jt == "Something")
{
  $('#catch_value').val('Handle Accounts');
}
if (jt == "SomethingElse")
{
   $('#catch_value').val('somethingelse');
}
 });

选择下拉菜单时，onchange功能将填充文本框

4 个答案: