This article example shares the specific code of JavaScript to implement asynchronous submission of form data for your reference. The specific content is as follows The effect is as follows: First, let’s look at the HTML code: <div class="container"> <form class="form-horizontal" onsubmit="return false;"> <div class="form-group"> <label class="control-label col-md-3">Name:</label> <div class="col-md-4"> <input type="type" name="txtname" value=" " class="form-control" id="txtName"/> </div> </div> <div class="form-group"> <label class="control-label col-md-3">Gender:</label> <div class="col-md-4"> <select class="form-control" name="cboSex" id="cboSex"> <option>Male</option> <option>Female</option> </select> </div> </div> <div class="form-group"> <label class="control-label col-md-3">Address:</label> <div class="col-md-4"> <textarea class="form-control" name="txtAddress" id="txtAddress"></textarea> </div> </div> <div class="form-group"> <button class="btn btn-primary col-md-offset-4" onclick="getVal()">Get the value of the form</button> <button class="btn btn-primary" onclick="postgetData()">Submit data</button> <button class="btn btn-success" onclick="getData()">Get data</button> </div> </form> </div> The JavaScript part is as follows: function postgetData() { var xhr; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else { xhr = new ActiveXObject("microsoft.XMLHTTP"); } xhr.open("post", "/JQuery/getDataRequest", true); xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); var yy = "name=" + document.getElementById("txtName") .value + "&sex=" + document.getElementById("cboSex") .value + "&address=" + document.getElementById("txtAddress").value; xhr.send(yy); xhr.onreadystatechange = function () { if (xhr.status == 200 && xhr.readyState == 4) { var txt = xhr.responseText; console.log(txt); } } } xhr.send(data); //Data to be submitted in the data form (string) setRequestHeader syntax: setRequestHeader(header,value): Adds an HTTP header to the request. The controller method is as follows: Request.Form (submission method is post) public ActionResult getDataRequest() { string name = Request.Form["name"]; string sex = Request.Form["sex"]; string address = Request.Form["address"]; string str = name + "&" + sex + "&" + address + "&" + "Request can only receive post data"; return Content(str); } This will submit the data in the form. The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM. You may also be interested in:
|
<<: How to use VirtualBox to build a local virtual machine environment on Mac
>>: Solve the problems encountered when installing mysql-8.0.11-winx64 in Windows environment
This article shares the specific code of Vue to r...
Table of contents Preface: 1.Brief introduction t...
After creating a container locally, you can creat...
Preface In front-end development, we often encoun...
Table of contents Shallow copy Deep Copy Replenis...
Table of contents First Look Index The concept of...
This article shares the specific code of jQuery t...
Solution-1: Download the msvcr100.dll file (find ...
Maybe you are using include files here, which is u...
Sample code: import java.util.Random; import java...
The specific code is as follows: <a href="...
This article will introduce how to use Docker to ...
Preface The previous article introduced the insta...
All websites, whether official, e-commerce, socia...
<br />This tag can be used to directly add a...