我在javascript中非常糟糕,jquery..i必须创建一个页面,其中课程将分配给教师,如果教师的剩余学分低于分配给教师的课程学分,则会打开一个对话框如果没有被选中,那么对话框将关闭无效,如果是,那么该课程将分配给老师,老师的剩余学分将变为减去。我的对话框在显示后立即关闭而且我也不知道如果选择是,那么将在数据库中插入值,请帮忙 这是我的对话框代码...
$("#submit").click(function () {
var courseCredit = $("#courseCredit").val();
var remainingCredit = $("#remainingCredit").val();
if (remainingCredit < courseCredit) {
//var dialog = $("#dialog");
$('<div title="Confirm Box"></div>').dialog({
open: function (event, ui) {
$(this).html("Yes or No question?");
},
autoOpen:true,
resizable: false,
width:'auto',
modal: true,
buttons: {
'Yes': function () {
$(this).dialog('close');
},
'No': function () {
$(this).dialog('close');
}
},
close: function (event,ui) {
$(this).remove();
}
});
}
});
这是HTML代码......
<form method="POST">
<table>
<tr>
<td>
<label>Department</label>
<select name="departmentId" id="departmentId">
<option value="">Select...</option>
@foreach (var department in departments)
{
<option value="@department.DepartmentId">@department.DepartmentName</option>
}
</select>
</td>
</tr>
<tr>
<td>
<label>Teacher</label>
<select name="teacherId" id="teacherId">
<option value="0">Select...</option>
</select>
</td>
</tr>
<tr>
<td>
<label>Credit to be taken</label>
@*@Html.TextBoxFor(d=>d.)*@
<input type="text" name="creditTaken" id="creditTaken" readonly value="@Model.CreditTaken" />
</td>
</tr>
<tr>
<td>
<label>Remaining Credit</label>
<input type="text" name="remainingCredit" id="remainingCredit" readonly value="@Model.RemainingCredit" />
</td>
</tr>
<tr>
<td>
<label>Course Code</label>
<select name="courseId" id="courseId"></select>
</td>
</tr>
<tr>
<td>
<label>Name</label>
<input type="text" name="courseName" id="courseName" readonly />
</td>
</tr>
<tr>
<td>
<label>Credit</label>
<input type="email" name="courseCredit" id="courseCredit" readonly />
</td>
</tr>
<tr>
<td>
<input type="submit" name="submit" id="submit" value="Assign"/>
</td>
</tr>
<tr>
<td>
@if (ViewBag.ValidationMsg != null)
{
<p>@ViewBag.ValidationMsg</p>
}
</td>
</tr>
</table>
</form>
...控制器
public ActionResult CourseAssign(CourseAssign courseAssign)
{
var departments = _departmentManager.GetAllDepartments();
ViewBag.Departments = departments;
courseAssign.RemainingCredit = courseAssign.RemainingCredit - courseAssign.CourseCredit;
int rowAffected = _teacherManager.InsertCourseAssign(courseAssign);
if (rowAffected > 0)
{
ViewBag.ValidationMsg = "Successfull.";
return View(courseAssign);
}
ViewBag.ValidationMsg = "This course is already assigned.";
return View(courseAssign);
//}
//ViewBag.Checkmsg = "This course is already assigned.";
//return View(courseAssign);
}
答案 0 :(得分:1)
从我在代码中看到的问题来看,问题依赖于$(&#34;#submit&#34;)按钮点击。单击提交按钮后,您将看到弹出窗口,但页面将POST到您的控制器,这会导致页面重新加载(因此您将丢失弹出窗口)。
我建议将提交按钮的类型更改为&#34;按钮&#34;这将阻止POST。
然后在您的表单中添加一个ID,因此在您的javascript代码中,您可以根据需要使用以下说明提交表单:$(&#34; #formid&#34;)。submit();
所以你的代码可能是这样的:
$("#submit").click(function () {
var courseCredit = $("#courseCredit").val();
var remainingCredit = $("#remainingCredit").val();
if (remainingCredit < courseCredit) {
//var dialog = $("#dialog");
$('<div title="Confirm Box"></div>').dialog({
open: function (event, ui) {
$(this).html("Yes or No question?");
},
autoOpen:true,
resizable: false,
width:'auto',
modal: true,
buttons: {
'Yes': function () {
$("#formid").submit(); // submit to save in db
},
'No': function () {
$(this).dialog('close');
}
},
close: function (event,ui) {
$(this).remove();
}
});
}
});
你的html就像:
<form method="POST" id="formid">
<table>
<tr>
<td>
<label>Department</label>
<select name="departmentId" id="departmentId">
<option value="">Select...</option>
@foreach (var department in departments)
{
<option value="@department.DepartmentId">@department.DepartmentName</option>
}
</select>
</td>
</tr>
<tr>
<td>
<label>Teacher</label>
<select name="teacherId" id="teacherId">
<option value="0">Select...</option>
</select>
</td>
</tr>
<tr>
<td>
<label>Credit to be taken</label>
@*@Html.TextBoxFor(d=>d.)*@
<input type="text" name="creditTaken" id="creditTaken" readonly value="@Model.CreditTaken" />
</td>
</tr>
<tr>
<td>
<label>Remaining Credit</label>
<input type="text" name="remainingCredit" id="remainingCredit" readonly value="@Model.RemainingCredit" />
</td>
</tr>
<tr>
<td>
<label>Course Code</label>
<select name="courseId" id="courseId"></select>
</td>
</tr>
<tr>
<td>
<label>Name</label>
<input type="text" name="courseName" id="courseName" readonly />
</td>
</tr>
<tr>
<td>
<label>Credit</label>
<input type="email" name="courseCredit" id="courseCredit" readonly />
</td>
</tr>
<tr>
<td>
<input type="button" name="submit" id="submit" value="Assign"/>
</td>
</tr>
<tr>
<td>
@if (ViewBag.ValidationMsg != null)
{
<p>@ViewBag.ValidationMsg</p>
}
</td>
</tr>
</table>
</form>
希望这有帮助!