我正在尝试根据从下拉菜单中选择的ID更新我的学生详细信息。我正在使用ASP.net MVC。我是MVC和编码的新手，所以请尽可能地愚弄你的答案:)
我认为ajax涉及到某人，但我真的很感激，如果有人可以给我一些提供一些示例代码，所以我知道如何开始如果有人可以提供帮助，那将非常感激 -
This is a screen shot of the page I am creating 索引代码如下
@model ResultModel
@using WebApplication3.Models
@{
Layout = null;
}
<div class="container">
<div id="flashMessage">
New Student Details!
</div>
<form>
<div class="form-group">
<label for="exampleFormControlSelect1">Please Choose Student</label>
<select class="form-control" id="StudentName">
<!--Drop down menu-->
@foreach (var item in Model.Student)
{
<option>@item.StudentNumber</option> }
</select>
</div>
</form>
<!---------------->
<br /><br /><br /><br /><br /><br /><br />
<!-- Student information form -->
<h4 >Student information</h4>
<p id="cat">This will display the students information based on what is selected from the drop down menu</p>
<code>SELECT `title`,`first name`,`surname` FROM `STUDENT REGISTER` WHERE `Student number` = 'OPTION SELECTED' </code>
<form method="post">
<div class="form-row">
<label for="exampleInputEmail1">Title</label>
<input type="text" class="form-control" id="title" aria-describedby="emailHelp" placeholder="Person n">
</div>
<div class="form-row">
<label for="exampleInputEmail1">Name</label>
<input type="text" class="form-control" id="firstname" aria-describedby="emailHelp" placeholder="student Name">
</div>
<div class="form-row">
<label for="exampleInputEmail1">Surname</label>
<input type="text" class="form-control" id="surname" aria-describedby="emailHelp" placeholder="Surname">
</div>
<br /><br /><br /><br /><br /><br /><br />
<!-- Student notes -->
<h4 id="test">Student Notes</h4>
<p>This will display all the notes for that studend - these need to have edit button within the table to edit the fields but also have option for drop</p>
<code>SELECT `Date of note`,`Staff Member`,`notes` FROM `student Notes` WHERE `Student number` = option selected </code>
<br />
<br />
<br />
<table class="table table-striped" id="myTable">
<thead>
<tr>
<th scope="col">date</th>
<th scope="col">Note ID</th>
<th scope="col">Notes</th>
<th scope="col">Staff ID</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.Notes)
{
<tr>
<td>@item.User</td>
<td> @item.Notes</td>
<td> @item.Id</td>
<td> @item.Staff</td>
</tr>
}
</tbody>
</table>
<br /> <br /><br /><br />
<input class="btn btn-primary btn-lg" type="submit" value="Delete Student">
<input class="btn btn-primary btn-lg" type="submit" value="Edit Student">
</form>
</div>
<div></div>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/core.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>-->
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
$("#flashMessage").hide();
$(document).ready(function () {
$("#StudentName").change(function () {
const sSname = document.getElementById("StudentName").value
$('#title').val("Should Display title");
$('#firstname').val("Should Display first Name");
$('#surname').val("Should display last name");
//testing jquery - no longer in use just keeping for refrence.
// $("#test").text("Hello world!"); // alert("Selected value is : " + document.getElementById("StudentName").value); // $("#test").hide();
// $("#flashMessage").slideDown(1000).delay(2000).slideUp(1000);
});
});
//change date to sort by dd/mm/YYYY
jQuery.extend(jQuery.fn.dataTableExt.oSort, {
"date-uk-pre": function (a) {
if (a == null || a == "") {
return 0;
}
var ukDatea = a.split('/');
return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},
"date-uk-asc": function (a, b) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"date-uk-desc": function (a, b) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
});
//select the the tabe and field where the formating is allplied
$('#myTable').dataTable({
columnDefs: [
{ type: 'date-uk', targets: 0 }
]
});
</script>
在下拉列表更改事件上进行ajax调用
$("#dropdownid").change(function () {
$.ajax({
type: "GET",
url: $('#hdnPath').val() + '/Controller/TestActionmethod',
data: {
dropdownid: $("#dropdownid").val()
},
contentType: 'application/json; charset=utf-8',
dataType: "json"
});
使用ViewModel参数返回TestAction方法的相同视图，它将起作用。像这样的东西
return View("viewName", Viewmodel );