Javascript 单击按钮时,输入框值消失
我刚刚开始使用JQuery for asp.net核心mvc 我有一个页面的一部分,包含一个与主题相关的项目列表。当对其中一个列表项单击“编辑”按钮时,将显示一个隐藏部分(字段集),并填充该列表项的值。页面上的其他输入被禁用,用户可以编辑该项目。一切正常 但是,编辑完成后,用户单击“提交”按钮(在先前隐藏的字段集中),想法是通过ajax提交编辑的数据,如果接受,则更新列表。Ajax等还不是问题所在 当用户单击“提交”按钮(编码为type=“button”)时,编辑部分中的值似乎已被清除,并以空格或空值的形式返回。它似乎只适用于此字段集,因为可以从文档的其余部分检索(禁用)值(仅用于测试目的) 有人能告诉我这里发生了什么,以及如何保存这些编辑过的值吗Javascript 单击按钮时,输入框值消失,javascript,c#,jquery,asp.net-core-mvc,Javascript,C#,Jquery,Asp.net Core Mvc,我刚刚开始使用JQuery for asp.net核心mvc 我有一个页面的一部分,包含一个与主题相关的项目列表。当对其中一个列表项单击“编辑”按钮时,将显示一个隐藏部分(字段集),并填充该列表项的值。页面上的其他输入被禁用,用户可以编辑该项目。一切正常 但是,编辑完成后,用户单击“提交”按钮(在先前隐藏的字段集中),想法是通过ajax提交编辑的数据,如果接受,则更新列表。Ajax等还不是问题所在 当用户单击“提交”按钮(编码为type=“button”)时,编辑部分中的值似乎已被清除,并以空格
@**** Drop-down section for editing Admissions ****@
<fieldset id="AdmissionsEditFieldset" class="app-edit-main-fieldset" hidden>
<legend id="AdmissionsEditLegend" class="app-edit-fieldset-legend">Editing Admission</legend>
<div class="row">
<div class="col-sm-12" style="padding-left: 5%; padding-right: 5%">
<div class="form-group">
<strong><label>Institution:</label></strong>
<span class="app-label-to-input-sep">
<input id="admId" name="aId" type="text" class="form-input app-can-disable" asp-for="Admission.Id" hidden />
<select id="admPlace" name="aPlace" type="text" class="app-can-disable" asp-items="Model.PlaceOfDetentionDd" asp-for="Admission.PlaceId"></select>
</span>
<strong><label class="app-input-fld-sep">Date Admitted:</label></strong>
<span class="app-label-to-input-sep">
<input id="admDate" name="aDate" type="text" class="form-input app-can-disable" asp-for="Admission.DateAdmitted" style="width: 5%" />
</span>
<strong><label class="app-input-fld-sep">Sequence:</label></strong>
<span class="app-label-to-input-sep app-can-disable">
<input id="admSeq" name="aSeq" type="text" class="form-input" asp-for="Admission.Seq" style="width: 5%" />
</span>
<span>
<button id="admSubmitBtn" class="btn btn-sm btn-primary app-adm-edit-btn" type="button">Submit</button>
<button id="admCancelBtn" type="button" class="btn btn-sm btn-danger app-button-to-button-sep">Cancel</button>
</span>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12" style="padding-left: 5%; padding-right: 5%">
</div>
</div>
是的,非常感谢你的建议,mj 然而,试图了解为什么和测试替代方案让我想到了真正的问题。我必须承认,这是一种愚蠢的行为,你可以盯着看几个小时却看不见。尽管如此,我还是要承认,以防这对其他人有所帮助 我给列表中的编辑按钮起了一个“虚拟”类名,以便于选择。然后,我无意中复制并修改了按钮html,使之成为编辑后的提交按钮,,而没有删除类。因此,编辑和提交按钮处理程序似乎都被调用了,这造成了巨大的破坏(我还没有弄清楚为什么这不仅仅是在第二个处理程序中生成未编辑的文本,而是生命太短)。对我来说,这是一个愚蠢的问题——对不起,浪费了大家的时间
构造$('#admId').val($('#ident'+sid).text());现在工作正常。如果您注释掉
$('#admId').val($('#ident'+sid).text())代码>是否有一个字段停止清除?。。。。。。。。。。。。。。。
$(document).ready(function () {
$('.app-adm-edit-btn').click(function (event) {
//*** Prevent default button actions
event.preventDefault();
// btn has format 'editN[N...]'
var btn = event.target.id;
var sid = btn.substring(4);
//*** Un-hide the editing drop-down
$('#AdmissionsEditFieldset').removeAttr('hidden');
//*** Copy values from the relevent line in the table to the editing drop-down
$('#admId').val($('#ident' + sid).text());
$('#admPlace').val($('#placeN' + sid).text());
$('#admDate').val($('#dateAdm' + sid).text());
$('#admSeq').val($('#seq' + sid).text());
//*** Set the section legend
$('#AdmissionsEditLegend').text('Editing an Admission');
//*** Disable other sections
DisableFieldsets(); // Works OK - makes no difference if commented out
//*** Focus the first input box
$('#admPlace').focus();
}); // $('.app-adm-edit-btn').click
/*----------------------------------------------------------------------------------
Admissions Submit button click handler
----------------------------------------------------------------------------------*/
$('#admSubmitBtn').click(function (event) {
//*** Prevent default button actions
event.preventDefault();
// Just to verify nothing wrong with JSON.stringify
var id = $('#admId').val();
var placeId = $('#admPlace').val();
var seq = $('#admSeq').val();
var dateAdmitted = $('#admDate').val();
var court = $('#Court').val();
// Not integrated, so that I can display the values
var jsn = JSON.stringify({
Id: $('#admId').val(),
PlaceId: $('#admPlace').val(),
Seq: $('#admSeq').val(),
DateAdmitted: $('#admDate').val()
});
$.ajax({
url: "api/EditAdmissionApi",
method: "POST",
contentType: "application/json",
data: jsn,
success: function (data) {
alert("Ajax Success"); //TODO
}
});
alert(jsn);
//TODO
});
/*------------------------------------------------------------------------
Admissions Cancel button click handler
--------------------------------------------------------------------------*/
$('#admCancelBtn').click(function (event) {
//*** Prevent default button actions
event.preventDefault();
});
}); // $(document).ready
/*===========================================================================
Helper Functions
===========================================================================*/
/*---------------------------------------------------------------------------
DisableFieldsets Helper function to disable fieldsets while input of linked
items takes place
---------------------------------------------------------------------------*/
function DisableFieldsets() {
DoDisableFieldsets('#MainFieldset');
DoDisableFieldsets('#AdmissionsFieldset');
DoDisableFieldsets('#ChildrenFieldset');
DoDisableFieldsets('#SubmitButtonsNonFieldset');
}
function DoDisableFieldsets(id) {
var xId = $(id);
$('.app-can-disable', xId).attr('disabled', 'disabled');
$(xId).addClass('app-disabled-background');
}