Question

我的客户有一个奇怪的要求，不知道如何解决它。

我通过ajax发送数据，成功后我想通过显示消息转到另一个页面，我用GET方法处理这个问题，当ajax成功然后使用

window.location.assign('Confirmation.aspx?d=data')

切换到欲望页面，但客户说不GET：D，所以任何想法如何用帖子做。

我尝试了什么:)

<form action="Confirmation.aspx" method="POST" id="mok">
    <input id="mail" type="hidden" value="data" name="m" />
</form>

$("#mok").submit();

但没有成功，页面没有变化，我在同一页

Answer 1

我不得不承认，我在提交过程中发生的事情的第一部分仍然不清楚，但是，您可以将自己添加到onsubmit函数中以首先将数据发送到您的ajax-target，并且在您完成请求（成功）后，将用户重定向到第二页。

＆＃13;

// be sure to always return false, otherwise the default method would be used
function postForm(formElement) {
  if (typeof formElement === 'undefined' || !formElement) {
    // invalid call (expects at least the form element)
    return false;
  }
  // you could do some validation here, if you want, if it's unsuccesfull, show a message and return false
  // ...
  // check if the request hasn't been sent yet, if so, return false won't be resubmitted
  if (postForm.active) {
    return false;
  }
  postForm.active = true;

  // add a default option for the ajax call (in case no js is available, this option wouldn't be there
  // so you could redirect the page from aspx page)
  var data = {
      ajax: 1
    },
    hiddenElements = $('[type=hidden]'),
    i, 
      len, 
      dataKey, 
      dataValue, 
      dataItem,
      targetUrl = formElement.getAttribute('data-redirect');
  
  // get the hidden values to send that were added to the form
  for (i = 0, len = hiddenElements.length; i < len; i++) {
    dataItem = hiddenElements[i];
    dataKey = dataItem.name;
    dataValue = dataItem.value;

    if (typeof data[dataKey] !== 'undefined') {
      data[dataKey] = ',' + dataValue;
    } else {
      data[dataKey] = dataValue;
    }
  }

  // send the ajax request
  $.ajax({
    url: formElement.action,
    type: formElement.method || 'post',
    data: data,
    complete: function(response, state) {
      // free the form again (can be resubmitted at this time)
      postForm.active = false;
      if (state !== 'error') {
        // success, navigate to defined data-redirect
        window.location.assign(targetUrl);
      } else {
        // failed throw error, show message to user
        alert('Error occured during the request: ' + state);
      }
    },

  });
  // return false so that the form doesn't submit on its own
  return false;
}

// attach to all css class with name .submitter (allowing you to attach the mock submit request site wide)
$(function() {
  $('.submitter').on('click', function(e) {
    e.preventDefault();
    $('#mok').submit();
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="[send-ajax-data-target-url]" method="post" id="mok" onsubmit="return postForm(this);" data-redirect="Confirmation.aspx">
  <input id="mail" type="hidden" value="data" name="m" />
  <button type="submit">Mock request</button>
</form>

<a href="#" class="submitter">Mock request</a>

＆＃13;

上述代码的一个缺点是，它不能在没有javascript的情况下工作，但是，如果您的操作是Confirmation.aspx并且您没有看到＆＃34; ajax = 1＆＃34;你Request.Form中的参数，你可以强制从那里重定向，然后保持使用js的双重功能来提交你的表单并重定向到可以支持它的客户端，并使用来自confirmation.aspx的重定向发布给那些谁不支持它。

最后，如果您的请求仍然需要通过ajax发送，我不能确定100％（上面的代码使用了表单中定义的操作（所以发布/获取）），但是我以为我还会发布它。

成功发布表格和更改页面的ajax

1 个答案: