C# 从HTML发布到单独的.NET核心应用程序_C#

C# 从HTML发布到单独的.NET核心应用程序

C# 从HTML发布到单独的.NET核心应用程序,c#,C#,我们按照本教程使用ASP.NET核心和Visual Studio for Windows创建了一个Web API，并创建了一个ToDoApi项目。我可以通过项目和邮递员发布和获取URL: 然后，我使用ASP.NETWebForms网站创建了一个新项目。我使用以下html添加了新的Web表单： <body> <form id="form1" runat="server" method="post" action="http://localhost:2399/api/Cr

我们按照本教程使用ASP.NET核心和Visual Studio for Windows创建了一个Web API，并创建了一个ToDoApi项目。我可以通过项目和邮递员发布和获取URL:

然后，我使用ASP.NETWebForms网站创建了一个新项目。我使用以下html添加了新的Web表单：

<body>
    <form id="form1" runat="server" method="post" action="http://localhost:2399/api/Create">
        <div>
            <asp:Label  Text="Name:" runat="server" />
            <asp:TextBox runat="server" name="name"/>
            <br />
            <asp:Button Text="Submit" runat="server"  />
        </div>
    </form>
</body>

简单表单调用api（这不起作用）：


我的API
添加新的潜在客户
提交
函数send（）{
//var ItemJSON={
//“全名”：$（'#add name'）.val（），
//“公司”：$（“#添加公司”）.val（），
//“电话”：$（“#添加电话”）.val（），
//“电子邮件”：$（“#添加电子邮件”）.val（），
//“地址”：$（'#add Address'）.val（），
//“城市”：$（“#添加城市”）.val（），
//“状态”：$（“#添加状态”）.val（），
//“Zip”：$（'#add Zip'）.val（），
//“说明”：$（“#添加说明”）.val（）
//};
var ItemJSON='{“全名”：“NA”，“电话”：“31439289452”，“分机”：“5000”，“电子邮件”：“m”。alkurwi@Yahoo.com“，”公司“：”PlazSoft“，”地址“：”357“，”描述“，”城市“，”STL“，”州“，”MO“，”Zipcode“：”63125“}”；
警报（'1'）
URL=”http://localhost:59930/api/values“；//您的URL
var xmlhttp=new XMLHttpRequest（）；
xmlhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
警报（this.responseText）；
}
};
警报（'2'）
open（“POST”，URL，true）；//尝试了false和true
setRequestHeader（“内容类型”、“应用程序/json”）；
send（JSON.stringify（ItemJSON））；
document.getElementById（“div”）.innerHTML=xmlhttp.statusText+：“+xmlhttp.status+”
“+xmlhttp.responseText+”；
}

发帖人可以向其发帖，但web表单无法选择正确的客户端技术

根据您的问题级别，我建议您从一个简单的html站点（从这里学习：）开始，使用一些js。也许还可以使用jquery（），它可以让您的第一步更加轻松。通过这种方式，您将学习基础知识

我个人认为这是你应该理解的基本要素。之后，你可以向前迈出一步，学习角度

（提示使用JS调用rest服务非常简单。请参见以下示例：

)

不要将webforms混入其中-它实际上与webforms后端的互操作紧密相连。我们希望.NET核心作为后端API，HTML表单作为前端。你有什么建议吗？只需直接使用html-no

runat

crap。请参阅更新：简单表单调用api（这不起作用）。

  public class TodoController : Controller
    {
        private readonly TodoContext _context;

        public TodoController(TodoContext context)
        {
            _context = context;

            if (_context.TodoItems.Count() == 0)
            {
                _context.TodoItems.Add(new TodoItem { Name = "Item1" });
                _context.SaveChanges();
            }
        }

        [Route("~/api/Create")]
        [HttpPost]
        public IActionResult Create([FromBody] TodoItem item)
        {
            if (item == null)
            {
                return BadRequest();
            }

            _context.TodoItems.Add(item);
            _context.SaveChanges();

            return CreatedAtRoute("GetTodo", new { id = item.Id }, item);
        }

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>MY API</title>
</head>
<body>
    <h1>ADD NEW LEAD</h1>
        <input type="text" id="add-name" placeholder="Full Name">
        <input type="text" id="add-company" placeholder="Company">
        <input type="text" id="add-phone" placeholder="Phone">
        <input type="text" id="add-email" placeholder="Email">
        <input type="text" id="add-address" placeholder="Address">
        <input type="text" id="add-city" placeholder="City">
        <input type="text" id="add-state" placeholder="State">
        <input type="text" id="add-zip" placeholder="Zip Code">
        <input type="text" id="add-description" placeholder="Description">

        <button type="submit" onclick="javascript:send()">Submit</button>


    <div id='div'>

    </div>

    <script type="text/javascript" language="javascript">

        function send() {
            //var ItemJSON = {
            //    "FullName": $('#add-name').val(),
            //    "Company": $('#add-company').val(),
            //    "Phone": $('#add-phone').val(),
            //    "Email": $('#add-email').val(),
            //    "Address": $('#add-address').val(),
            //    "City": $('#add-city').val(),
            //    "State": $('#add-state').val(),
            //    "Zip": $('#add-zip').val(),
            //    "Description": $('#add-description').val()
            //};
            var ItemJSON = '{    "FullName": "NA", "Phone": "31439289452", "Ext": "5000",  "Email": "m.alkurwi@Yahoo.com","Company": "PlazSoft", "Address": "357 Hinder dr",  "Description": "tsetteststeste",   "City": "STL",    "State": "MO",  "Zipcode": "63125"  }';
            alert('1')
            URL = "http://localhost:59930/api/values";  //Your URL

            var xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function () {
                if (this.readyState == 4 && this.status == 200) {
                    alert(this.responseText);
                }
            };
            alert('2')
            xmlhttp.open("POST", URL, true);//tried both false and true
            xmlhttp.setRequestHeader("Content-Type", "application/json");
            xmlhttp.send(JSON.stringify(ItemJSON));
            document.getElementById("div").innerHTML = xmlhttp.statusText + ":" + xmlhttp.status + "<BR><textarea rows='100' cols='100'>" + xmlhttp.responseText + "</textarea>";
        }

    </script>
</body>
</html>