Question

例如，我有一个页面来编辑用户数据。在页面顶部是一个决定是否来自自己的提交。如果提交，则保存数据并关闭页面。如果没有，则输入字段可见。

但是我希望能够在某些数据被更改时重新加载页面（例如，选择下拉菜单）。因为当此下拉菜单更改时，其他数据也应更改或禁用等。因此，我需要使用POST数据重新加载页面，但不保存数据。但是当我使用Submit（）时，它将被保存并关闭。

是否可以通过POST数据发送表单，但能够决定是否应该最终保存数据或仅使用POST数据更新表单？

谢谢！马库斯

Answer 1

当选项更改并且您需要在页面上隐藏或显示详细信息时，重新加载页面并不是最佳的用户体验。如果可以的话，我建议您将该逻辑完全放在前端。如果您需要基于仅在服务器上提供的答案的其他数据，请对后端使用GET调用，并使用结果填充前端。

在没有更多细节的情况下，我只能创建此小片段，以使您了解如何执行此操作。注释在代码中。

$('document').ready(function() {
  $('#state').change(function() {

    // NOTE: code only used to show a visual change. Add logic into the .get call success function. Here, read the state and set the input to enabled or disabled depending on what is returned from the server.
    var state = this.value;
    $("#name").prop('disabled', state === "0" ? 'disabled' : '');

    // Make the server call, use GET as you are getting information.
    // The variable provided to the backend is state with value 0 or 1, (?state=0) 
    $.get("https://yourserver/?state=" + state, function(data) {

      // when the call is successful, use the data object to determine what should be done. 
      var state = data.state;
      $("#name").prop('disabled', state === "0" ? 'disabled' : '');
    });
  });

});

input:disabled {
  background-color: #ccc;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form>
  <select id="state">
    <option value="1">Enabled</option>
    <option value="0">Disabled</option>
  </select>
  <p><input type="text" id="name" placeholder="Your name"></p>
  <div class="result"></div>
</form>

提交带有其他选项的表格？

1 个答案: