Javascript 如何在不重定向或重新加载页面的情况下更新字段/发布表单?

Javascript 如何在不重定向或重新加载页面的情况下更新字段/发布表单?,javascript,jquery,asp.net,ajax,asp.net-core,Javascript,Jquery,Asp.net,Ajax,Asp.net Core,我有以下代码来更新数据库中的一个字段,该字段名为Flag,是一个布尔字段。如何在不重新加载页面和重定向的情况下更新标志字段。我厌倦了ajax/Jquery,但它第一次工作,然后在更新列表中的下一项时停止,在下一个列表上单击它,在地址栏中显示ID和标志值,但不更新记录,仅在更新列表中的第一项时工作 <form id="updateflag"> @if (item.Flag == "Off") {

我有以下代码来更新数据库中的一个字段,该字段名为
Flag
,是一个布尔字段。如何在不重新加载页面和重定向的情况下更新
标志
字段。我厌倦了ajax/Jquery,但它第一次工作,然后在更新
  • 列表中的下一项时停止,在下一个列表上单击它,在地址栏中显示ID和标志值,但不更新记录,仅在更新列表中的第一项时工作

     <form id="updateflag">
             @if (item.Flag == "Off")
               {
                <input name="ID" type="hidden" value="@item.ID" />  //value changes based on the selected list item
                <input name="Flag" type="hidden" value="true" />//value changes based on the selected list item
                <button type="submit" class="btn btn-primary">&nbsp; @(Localizer["Turn Flag On"]) // value changes based on the selected list item</button>
                }
               @if (item.Flag == "On")
                 {
                  <input name="ID" type="hidden" value="@item.ID" />//value changes based on the selected list item
                  <input name="Flag" type="hidden" value="false" />//value changes based on the selected list item
                  <button type="submit" class="btn btn-primary">&nbsp; @(Localizer["Turn Flag Off"])</button>//value changes based on the selected list item
                 }
      </form>
    

    在按钮单击时更新字段值而不重定向并立即显示更新结果的最佳方法是什么?

    根据jquery代码,我发现您只需为updateflag绑定单击事件

    如果您有多个表单,Jquery单击绑定只适用于第一个表单


    您可以尝试为所有表单设置一个类,并在jquery中使用类选择器,如下所示:
    ,jquery:
    $('.update')。根据您的jquery代码提交

    ,我发现您只需为updateflag绑定单击事件

    如果您有多个表单,Jquery单击绑定只适用于第一个表单


    您可以尝试为所有表单设置一个类,并在jquery中使用类选择器,如下所示:
    ,jquery:
    $('.update')。提交

    为什么在使用AJAX时重新加载页面?返回结果中的值,以及您的
    success:window.location.reload()
    这是一种奇怪的语法,have
    success:function(result){/*在此处更新字段*/}
    您的意思是您有很多id为updateflag的表单吗?如果您有多个表单,jquery单击绑定只适用于第一个表单。您可以尝试为所有表单设置一个类,并在jquery中使用类选择器,如下所示:
    ,jquery:
    $('.update')。提交
    @BrandoZhang yep您完全正确,这就解决了为什么在使用AJAX时重新加载页面的问题?返回结果中的值,以及您的
    success:window.location.reload()
    这是一种奇怪的语法,have
    success:function(result){/*在此处更新字段*/}
    您的意思是您有很多id为updateflag的表单吗?如果您有多个表单,jquery单击绑定只适用于第一个表单。您可以尝试为所有表单设置一个类,并在jquery中使用类选择器,如下所示:
    ,jquery:
    $('.update')。提交
    @BrandoZhang yep您完全正确,这就解决了问题是的,谢谢,但是否仍有不重新加载整个页面的方法,只反映您的成功方法已触发的更改window.location.reload方法。您能告诉我为什么调用此方法吗?如果没有window.location.reload,我可以看到更新的值。它会更新数据库中的字段,但不会反映在视图中,这就是我添加window.location.reload的原因,在我的视图中,我希望看到更新的值。我使用标签作为
    Flag
    @customer.Flag
    是的,谢谢,但无论如何都不能重新加载整个页面,只反映您的成功方法触发的更改window.location.reload方法。您能告诉我为什么调用此方法吗?如果没有window.location.reload,我可以看到更新的值。它会更新数据库中的字段,但不会反映在视图中,这就是我添加window.location.reload的原因,在我的视图中,我希望看到更新的值。我使用标签作为
    Flag
    @customer.Flag
    $('#updateflag').submit(function (e) {
        e.preventDefault();
        let Data = $(this).serialize();
    
        $.post({
            type: 'POST',
            url: "/Customer/updateFlag",
            data: Data,
            success: window.location.reload()
        })
    })