用C#在Asp.net中实现JQuery Progress Circle

本文关键字:实现 JQuery Progress Circle net Asp | 更新日期: 2023-09-27 18:26:23

我在.aspx和客户端中使用jQuery Progress Circle,它运行良好。如何用服务器端的值填充它。

Javascript:

  <script>
    ( function( $ ){
        $( '#circle' ).progressCircle();
        $( '#submit' ).click( function() {
            var nPercent        = $( '#percent' ).val() ? $( '#percent' ).val() : 50;
            var showPercentText = $( '#percentOn' ).prop( 'checked' );
            var circleSize      = $( '#circle-size' ).val() ? $( '#circle-size' ).val() : 100;
            $( '#circle' ).progressCircle({
                nPercent        : nPercent,
                showPercentText : showPercentText,
                circleSize      : circleSize
            });
        })
    })( jQuery );
    </script>

上面的代码是点击按钮。我想在.cs页面的页面加载中填充它。请帮忙。

用C#在Asp.net中实现JQuery Progress Circle

#percent#percentOnclientIdMode='static'runat='server'一起使用的控件设置为隐藏。在aspx页面的页面加载中,在服务器端设置隐藏值的值。将submit.click中的代码移动到文档中。准备:

$( document ).ready(function() {
     var nPercent = $( '#percent' ).val() ? $( '#percent' ).val() : 50;
     var showPercentText = $( '#percentOn' ).prop( 'checked' );
     ......
});

试试这个

Javascript

<script>
        (function ($) {
            $('#circle').progressCircle();
            $(document).ready(function () {
                var nPercent = $('#<%=hdnprsent.ClientID%>').val();
                var showPercentText = $('#percentOn').prop('checked');
                var thickness = $('#<%=hdnthickness.ClientID%>').val();
                var circleSize = $('#<%=hdncirclesize.ClientID%>').val();
                $('#circle').progressCircle({
                    nPercent: nPercent,
                    showPercentText: showPercentText,
                    thickness: thickness,
                    circleSize: circleSize
                });
            })
        })(jQuery);
    </script>

.CS代码

只需将值放在任何您想要的隐藏字段上。

hdnprsent.Value = "30";
hdnthickness.Value = "6";
hdncirclesize.Value = "400";