材料输入标签不能正常工作？答案

【问题标题】：Material input label is not working properly?材料输入标签不能正常工作？
【发布时间】：2017-12-02 01:46:15
【问题描述】：

我将数据填充到模型中，并以这种方式显示。

点击后输入框这样显示。

这是刀片（模型编辑用户）

<div class="md-form col-md">
       <input type="text" id="name" name="name" class="form-control" required>
       <label for="name" class="">User Name</label>
</div>

这是我使用的 javascript 代码。

$('#users_view_table tbody').on('click', '#editUser', function (e) {
            e.preventDefault();
            var data = oTable.row($(this).parents('tr')).data();
            var dataname = data.name;

            $("#model-edit-users").modal('show');
            $('#model-edit-users').on('shown.bs.modal', function () {
                $('#name').val(dataname);
            });
        });

谁能帮我解决这个 UI 问题

【问题讨论】：

你可以试试这个用户名
@user8175473 非常感谢。我试了两天。谢谢你的好主意。
我创建了答案，如果它对您有用，请考虑接受答案以帮助人们理解问题已得到解决。
@user8175473 抱歉。再次感谢您
欢迎您 :) 没什么好说的抱歉，我刚刚创建了答案 :)

标签： javascript jquery html material-design bootstrap-modal

【解决方案1】：

您可以尝试使用<md-input-container>，如下所示

<md-input-container> 
  <label>User Name </label> 
  <input type="text" id="name" name="name" class="form-control" required> 
</md-input-container>

【讨论】：