Как связать Ajax Данные в Html Форма

Question

когда получите ajax данные из URL, тогда я хочу показать данные в Html форме

Json данных

[
  {
    "Buildings": {
      "Campuses": {
        "ID": 3,
        "Campus_Name": "Dhaka"
      },
      "ID": 9,
      "Building_Name": "D",
      "CampusID": 3
    },
    "Campuses": {
      "ID": 3,
      "Campus_Name": "Dhaka"
    },
    "ID": 17,
    "Floor_Name": "1st",
    "CampusID": 3,
    "BuildingID": 9
  }
]

Html

   <form id="form">
@Html.TextBoxFor(m => m.ID, new { @id = "Floor_ID", @class = "form-control", @placeholder = "Floor_ID**" })
                        <div class="form-group">
                            @Html.LabelFor(model => model.Floor_Name, htmlAttributes: new { @class = "col-form-label" })
                            @Html.TextBoxFor(m => m.Floor_Name, new { @id = "FloorName", @class = "form-control", @placeholder = "Name*" })
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.CampusID, htmlAttributes: new { @class = "col-form-label" })
                            @Html.DropDownListFor(m => m.CampusID, ViewBag.CampusID as SelectList, new { @class = "form-control", @id = "CampusID" })
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.BuildingID, htmlAttributes: new { @class = "col-form-label" })
                            <select id="BuildingID" name="BuildingID" class="form-control">
                                <option value="" >---Select---</option>
                            </select>

                </form>
                             

Answer 1

Попробуйте что-нибудь подобное !! для js у нас есть

<script>
    var array = JSON.parse(`[
                    {
                        "Id":1,
                        "Name":"Damilola",
                        "Age": 27
                    },
                    {
                        "Id":2,
                        "Name":"Mayowa",
                        "Age": 28
                    },
                    {
                        "Id":3,
                        "Name":"Toluwalope",
                        "Age": 24
                    },
                    {
                        "Id":1,
                        "Name":"Olaoluwa",
                        "Age": 21
                    }
                ]`);
    array.forEach(element => {
        document.getElementById("tbody").innerHTML += `<tr>
                                                            <td>${element.Id}</td>
                                                            <td>${element.Name}</td>
                                                            <td>${element.Age}</td>
                                                        </tr>`;
        console.log(element.Id, element.Name, element.Age);
    });

</script>

////////////////////////////////////////////////////////////////////////////// /////////////// для html, вы можете иметь

<table id="table">
    <tr>
        <thead>
            <tr>
                <td>Id</td>
                <td>Full Name</td>
                <td>Official Age</td>
            </tr>
        </thead>
        <tbody id="tbody">

        </tbody>
        <tfoot>
            <tr>
                <td>Id</td>
                <td>Full Name</td>
                <td>Official Age</td>
            </tr>
        </tfoot>
    </tr>
</table>

Answer 2

Если вы действительно хотите показать данные, вы можете сделать это, если html (cs html) выше

// использовать это для разбора строки json как объекта

var data = JSON .parse (THE- JSON -STRING);

// использовать это для целевых элементов, которые вы хотите

document.getElementById ( "FloorName"). Value = data.Floor_Name;

document.getElementById ("CampusID"). Value = data.CampusID;

document.getElementById ("BuildingID"). Value = data .BuildingID;