POST rest api from html form using javascript

Question

Welcome To Ask or Share your Answers For Others

POST rest api from html form using javascript

asked Feb 19, 2021 in Technique[技术] by 深蓝 (71.8m points)

I have an html form from which I need to collect data and call a POST on a rest api. I am trying to do this using javascript and $.ajax but confused on how to setup the URL and collect data as I am very new to it. Could someone explain this fully, with an example if possible as I'm having trouble finding detailed documentation.

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…

257 views

1 Answer

深蓝 · Answer 1 · 2021-02-19T04:05:07+0000

Try this:

<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<input type="text" value="3" name="id" id="GetId">
<button id="LoginBtn">login</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> 
</script>
<script>
    $("#LoginBtn").click(function (e){
    e.preventDefault();
    var settings = {
        "url": "http://192.168.1.3:8071/user/login",
        "method": "POST",
        "headers": {
            "Content-Type": "application/json"
        },
        "data": JSON.stringify({"username":"user","password":"123456"}),
    };
    $.ajax({
        ...settings,
        success: function (result) {
            alert("success")
        },
        error : function (){
            alert("error")
        }
    })
})
</script>
</body>
</html>

Categories

POST rest api from html form using javascript

Please log in or register to add a comment.

Please log in or register to answer this question.

1 Answer

Please log in or register to add a comment.

Just Browsing Browsing

Most popular tags