Jquery滑块。在滑块停止提升服务器端事件

时间:2013-10-04 11:27:02

标签: asp.net jquery asp.net-ajax

我想在jquery滑块的mouseup事件中引发服务器端事件。 我怎么能做到这一点?你能指出一个好的起点吗?

我要调用的服务器端代码是

Private Sub LoadBlock(ByVal AA As Integer)
'A lot of stuff here
End Sub

从Jquery滑块事件收集的值应作为上述过程中的参数传递

我目前的JQuery是

<script type="text/javascript">
    $(document).ready(function () {

        var Country = ['<% =String.Join("', '", arrayString)%>'];

        $('#slider-range-max').slider({
            max: '<%= arrayLength%>',
            min: 0,
            value: '<%= iValue%>',
            slide: function (event, ui) {
                var splitValues = Country[ui.value].split("~");
                $('#lblGame').html(splitValues[0]);
                $('#hpHome').html(splitValues[1]);
            },
            stop: function (event, ui) { }
        });
    });

</script>

最后这不是作业!!!

2 个答案:

答案 0 :(得分:3)

<script type="text/javascript">
    $(document).ready(function () {

        var Country = ['<% =String.Join("', '", arrayString)%>'];

        $('#slider-range-max').slider({
            max: '<%= arrayLength%>',
            min: 0,
            value: '<%= iValue%>',
            slide: function (event, ui) {
                var splitValues = Country[ui.value].split("~");
                $('#lblGame').html(splitValues[0]);
                $('#hpHome').html(splitValues[1]);
            },
            stop: function (event, ui) {
            //bof:AJAX hit
            var path="YourPageName.aspx/NewMethod";
            $.ajax({
                url:path,type:"POST",cache:"false",
                dataType:"json",contentType:"application/json; charset=utf-8",
                data:"{'str1':'Some Temp String'}",
                success:function(response){alert("response is "+response.d);
                },error:function(){
                }
            });
            //eof:AJAX hit
            }
        });
    });

</script>

并在代码背后:

<System.Web.Services.WebMethod> _
Public Shared Function NewMethod(str1 As String) As String
'make same name of variable as in json data
    'do your server side stuff
    Return "Success"
End Function

答案 1 :(得分:1)

我没有测试过这段代码,但肯定会对你有所帮助

按一个按钮

<asp:Button ID="img_update" runat="server" Text="Submit" style='display:none' OnClick="img_update_Click" />

你的方法非静态方法

 protected void img_update_Click(object sender, EventArgs e)
    {
//your code -behind
    }

现在你的jquery看起来像

<script type="text/javascript">
    $(document).ready(function () {

        var Country = ['<% =String.Join("', '", arrayString)%>'];

        $('#slider-range-max').slider({
            max: '<%= arrayLength%>',
            min: 0,
            value: '<%= iValue%>',
            slide: function (event, ui) {
                var splitValues = Country[ui.value].split("~");
                $('#lblGame').html(splitValues[0]);
                $('#hpHome').html(splitValues[1]);
            },
            stop: function (event, ui) {
                 document.getElementById('client id of button').click();
               }
        });
    });

</script>

我希望这会让你更好地了解如何实现非静态方法......:)