简体   繁体   English

需要一些Javascript ASP.NET建议

[英]Need some Javascript ASP.NET advice

I am a bit new to both javascript / asp.net but have a small dilemma, I have this simple page here (it is going to be a product page with options). 我对javascript / asp.net都有些陌生,但有一个小难题,我在这里有一个简单的页面(它将是带有选项的产品页面)。 If you select an option it returns the ID to the label right now so I know what has been selected, I need to get these 2 option ID's, query a database so it returns me a SKU in the label at the bottom without doing a postback, I read somewhere I should use some kind of ashx file but I don't really know what that means, any kind of steer on the right way forward and code examples is greatly appreciated. 如果选择一个选项,它会立即将ID返回到标签,因此我知道选择了什么,我需要获取这两个选项ID,查询数据库,以便它在底部的标签中向我返回SKU,而无需回发,我在某处阅读了应该使用某种ashx文件的信息,但我真的不知道这意味着什么,在正确的前进方式和代码示例中进行任何形式的指导都是值得赞赏的。

 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" /> <script type="text/javascript"> function SetOptions() { var a = document.getElementById("ddOption1"); var selectedIDa = a.options[a.selectedIndex].value; document.getElementById('option1').innerHTML = selectedIDa; var b = document.getElementById("ddOption2"); var selectedIDb = b.options[b.selectedIndex].value; document.getElementById('option2').innerHTML = selectedIDb; } </script> </head> <body> <form id="form1" runat="server"> <div class="container"> <table class="table"> <tr> <td>Color:</td> <td> <select name="ddOption1" id="ddOption1" onchange="SetOptions()"> <option selected="selected" value="0">-- Select --</option> <option value="283">Blue</option> <option value="299">White</option> <option value="296">Red</option> <option value="300">Yellow</option> </select> </td> <td> <label id="option1"></label> </td> </tr> <tr> <td>Size:</td> <td> <select name="ddOption2" id="ddOption2" onchange="SetOptions()"> <option selected="selected" value="0">-- Select --</option> <option value="1">Small</option> <option value="2">Medium</option> <option value="3">Large</option> </select> </td> <td> <label id="option2"></label> </td> </tr> </table> <br /> <label id="sku">SKU = </label> </div> </form> </body> </html> 

The ASHX file is called "ASP.NET handler", and it's purpose generally, it's to handle ajax requests. ASHX文件称为“ ASP.NET处理程序”,通常用于处理ajax请求。 Another way to handle Ajax requests in ASP.NET with webform pattern, is to use WebMethods, so take a look to them too. 使用Webform模式在ASP.NET中处理Ajax请求的另一种方法是使用WebMethods,因此也请看一下它们。

If you don't know what I'm talking about: 如果您不知道我在说什么:

Ajax requests are called also XMLHttpRequests and their purpose are to load a resource (text, binary...) with HTTP Requests that happen within the "Life" of a web page rendered on the browser. Ajax请求也称为XMLHttpRequests,其目的是通过在浏览器上呈现的网页的“生存期”内发生的HTTP请求加载资源(文本,二进制...)。 Then, with Javascript you can handle Ajax requests for take those info and make them interact with page logic/presentation. 然后,使用Javascript,您可以处理Ajax请求以获取这些信息,并使它们与页面逻辑/表示进行交互。

If I can suggest you a way to learn what you're doing, read about Ajax request, then learn about how they're managed with pure JS and then with JQuery (you're using it, and it has a bounch of methods for handle those requests) 如果我可以建议您一种方法来学习您的操作,请阅读有关Ajax请求的信息,然后了解如何通过纯JS然后通过JQuery(您正在使用它)来管理它们,并且该方法有很多方法可用于处理这些请求)

Then, I'll start to wonder if WebPage is the right way to create a website with Ajax, because MVC is a more flexible and "interactive-web oriented" pattern that allows you to have more freedom with page rendering 然后,我将开始怀疑WebPage是否是使用Ajax创建网站的正确方法,因为MVC是一种更加灵活和“面向交互式Web”的模式,可让您在页面呈现方面拥有更大的自由度

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM