Question

我想显示休息请求的结果而不重新加载页面。我正在使用RAVE 这是帖子的网址 https://ravesandboxapi.flutterwave.com/flwv3-pug/getpaidx/api/resolve_account

这是json

{
    "recipientaccount": "0690000034",
    "destbankcode": "044",
    "PBFPubKey": "FLWPUBK-4e9d4e37974a61157ce8ca4f43c84936-X"
}

这是回应

{
    "status": "success",
    "message": "ACCOUNT RESOLVED",
    "data": {
        "data": {
            "responsecode": "00",
            "accountnumber": "0690000034",
            "accountname": "Ade Bond",
            "responsemessage": "Approved Or Completed Successfully",
            "phonenumber": null,
            "uniquereference": "FLWT00976651",
            "internalreference": null
        },
        "status": "success"
    }
}

这是html表单

<form action="#" method="POST">
    <input type="text" name="full_name">
    <input type="email" name="email">
    <input type="text" name="recipientaccount">
    <select name="bankcode">
        <option value="044">ACCESS BANK</option>
    </select>
    <!-- Display Account Name from the json response -->
    <input type="submit" name="submit">
</form>

Answer 1

您可以使用jQuery Ajax。这是在后台异步发出HTTP请求的一种方式，因此不需要页面刷新。语法为：

$("form").submit(function(e){
  e.preventDefault();
  let form = $(this).serialize();
  $.ajax({
    url: 'https://ravesandboxapi.flutterwave.com/flwv3-pug/getpaidx/api/resolve_account',
    method: 'POST',
    data: form,
    dataType: 'json',
    success: function(data){ 
      //success function
      //return data form server
      console.log(data)
    },
    error: function(data){ //error function
      console.log(data)
    }
  });

});

参考：

http://api.jquery.com/jquery.ajax/

提交REST请求和GET响应，而无需重新加载页面

1 个答案: