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.
-
can you please add your code , what you done earlier.Dhrumil shah– Dhrumil shah2021-01-06 07:10:39 +00:00Commented Jan 6, 2021 at 7:10
-
Welcome to StackOverflow. Others may be able to help you better if you can include example code of what you are trying to accomplish and what you expect the result to be. See stackoverflow.com/help/how-to-ask for additional guidance.zhangxaochen– zhangxaochen2021-01-06 07:28:53 +00:00Commented Jan 6, 2021 at 7:28
Add a comment
|
2 Answers
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>
Comments
Please read this simple article https://javascript.info/fetch You could use axios or jquery but fetch api is really simple