填充模态项目 [英] Populate modal items

问题描述

我希望打开并填充一个bootstrap模式，基于从我的html表中选择的行和我从模型中获得的数据。我的html表中有一个按钮，它将调用JS函数并将id传递给它。我能够获取数据，我只是不知道如何用json列表填充模型



谢谢



我尝试过：



这是我的模态

Hi, i am looking to open and populate a bootstrap modal, based on the row selected from my html table and the data i have got from my model. I have a button within my html table that will calla JS function and pass the id to it. I am able to get the data back, i just dont know how to populate the model with the json list

thanks

What I have tried:

This is my modal

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Change User Deparment</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">
                <form>
                    <div class="form-group">
                        <label for="Employee Number" class="form-control-label">Employee Number:</label>
                        <input type="text" class="form-control" id="Employee Number">
                    </div>

                    <div class="form-group">
                        <label for="userName" class="form-control-label">User Name:</label>
                        <input type="text" class="form-control" id="userName">
                    </div>

                    <label for="department">Select Department</label>
                    <select class="form-control" id="department">
                        <option>Option1</option>
                        <option>Option2</option>
                        <option>Option3</option>
                    </select>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Send message</button>
            </div>
        </div>
    </div>
</div>

这是JS功能并致电获取用户详细信息

This is JS function and call to get the user details

function editUser(id) {

       //alert(userId);

       $.ajax({
           type: "GET",
           url: '@Url.Action("GetUserDetails", "Admin")',
           contentType: "application/json; charset=utf-8",
           datatype: JSON,
           data: ({ 'Value': id }),
           success: function () {



           },
           error: function () {
               alert(test);
           }
       });
   }

推荐答案

.ajax（{
type：GET，
url：'@ Url.Action（GetUserDetails，Admin）'，
contentType：application / json; charset = utf-8，
datatype：JSON，
data ：（{'Value'：id}），
成功：function（）{



}，
错误：function（）{
alert（test）;
}
}）;
}

.ajax({ type: "GET", url: '@Url.Action("GetUserDetails", "Admin")', contentType: "application/json; charset=utf-8", datatype: JSON, data: ({ 'Value': id }), success: function () { }, error: function () { alert(test); } }); }

这篇关于填充模态项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！