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
Table of contents 1. Location / Matching 2. Locat...
(I) Method 1: Define it in advance directly in th...
Table of contents Why do databases need indexes? ...
Table of contents Create a layout Add CSS styles ...
<table id=" <%=var1%>">, the...
Data backup and restore part 3, details are as fo...
DOCTYPE DECLARATION At the top of every page you w...
Table of contents 1. Create a stored function 2. ...
Table of contents Introduction Child Process Crea...
Table of contents Create a Vite project Creating ...
Table of contents What is NULL Two kinds of NULL ...
1. Introduction resolv.conf is the configuration ...
When one needs to edit or modify the website desi...
1. Spring boot does not support jsp jar package, ...
Question 1: When entering net start mysql during ...