从jQuery传递滑块值到后面的代码

Question

我正在使用ASP.NET和C#作为后面的代码。事情是这样的，我在我的代码中放了一个jQuery Slider，但是我不能把滑块的值传到C#中（已经在网上到处找了），我需要这些值，因为滑块的值必须作为我正在做的项目（一个可以购买产品的网站）的过滤器。我知道你不能直接从jQuery把值传到C#中，但是我试过把它们传到ASP.NET中，但似乎仍然无法访问。

  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
      $(function () {
          $("#slider-range").slider({
          range: true,
          min: 0,
          max: 3000,
          values: [ 50, 500 ],
          slide: function( event, ui ) {
              $("#amount").val(ui.values[0] + "€ - " + ui.values[1] + "€");      
      }
          });

        $( "#amount" ).val($( "#slider-range" ).slider( "values", 0 ) +
            "€ - " + $("#slider-range").slider("values", 1) + "€");
      } );
  </script>
<p>
  <asp:Label for="amount" runat="server">Precio:</asp:Label>
  <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>


<div id="slider-range">
</div>

现在，这里是它的样子。

"金额 "只是在 "Precio "Label中显示滑块的值。我需要一个变量，然后把它传给ASP，再传给C#，我该怎么做？

基本上，当我点击红色标记的按钮时，我想在C#中得到最小和最大的选择值，因为我必须将它们传递给项目的不同层。

我已经尝试过在asp上使用隐藏类型将jQuery的值放入其中，但是当我试图在C#中从隐藏类型中获取值时，我只是得到空值。

Answer 1

要把数据从javascript传递到后面的代码中，你可以把数据放在一个由后面的代码已知的元素中，也就是元素，例如一个隐藏的字段。

<asp:HiddenField ID="myValueField" ClientIdMode='STATIC' runat="server" />

就像你在帖子里做的那样，把值放在里面。

$("#myValueField").val(ui.values[0] + "€ - " + ui.values[1] + "€");

确保隐藏字段在你的PAGE -Form -Control里面 而且你的按钮会引起服务器端的回传。

Answer 2

你需要用HTTP POST回传到asp.net.看来你使用的是Asp.Net Web Forms，所以你可以注册到滑块的变化事件。检查 本文件

你可以用asp.net MVC做到这一点。

$(".btnSend").click(function(){
  $.post("/Controller/Action", { amount: $('#amount').val() }, function(data, status){
    //Response callback
    alert("Data: " + data + "\nStatus: " + status);
  });
});

Answer 3

不需要任何隐藏字段或ajax，只需将你的输入改为文本框。替换

<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">

与

<asp:TextBox ID="amount" ClientID="amount" ClientIDMode="static" runat="server" Style="border:0; color:#f6931f; font-weight:bold;" ReadOnly="True"/>

然后在后面的代码中，将值的 amount 字段将是你想要的两个值。也许用一些字符串操作来解析这些值。

var amt = amount.Value; // You may need to do something more here to get the value; it's been a
                        // few years since I worked with webforms...
var split = amt.Split(" - ");
var first = split[0].Replace("€", "");
var second =split[1].Replace("€", ""); 
// Do what you need to do with first and second...