Question

我有一个单选按钮和一个单选按钮列表，用于在asp.net中制作图表... 这两个按钮代表两个不同的值，我无法将它们组合起来...... 如果单击单选按钮列表中的任何一个按钮，我想取消选中单选按钮，反之亦然...

$(document).ready(function() {
    $("[id*=rbtnZone]").click(function() {
        $('#<%=rbtnStore.ClientID %> input:radio').each(function() {
            $(this).prop('checked', false);
        });
    });

    $("[id*=rbtnStore]").change(function() {
        $('#rbtnZone').prop('checked', false);
    });

 });


$(function() {
        $("[id*=rbtnStore]").click(function() {
            var row = $(this).closest('tr');
            var branchId = $(row).find('[id*=hfBranchId]').val();
            var rbtlSales = $("#<%= rbtlSales.ClientID%>");
            var selectedValue = rbtlSales.find("input:checked").val();

            var rbtnStore = $("#<%=rbtnStore.ClientID %>");
            var selectedZone = rbtnStore.find("input:checked").val();

            document.getElementById('<%=rbtlSales.ClientID %>').checked = false;

            var dt = new Date();
            /*Getting Todays Date only*/
            var ddt = new Date(dt.getFullYear(), dt.getMonth(), dt.getDate(), dt.getDay());
            ddt = ddt.toDateString();

            /*Yesterday's Date*/
            var ytd = new Date(new Date() - 24 * 60 * 60 * 1000);
            ytd = ytd.toDateString();

            /*Current Month First Date*/
            var firstdate = new Date(dt.getFullYear(), dt.getMonth(), 1);
            firstdate = firstdate.toDateString();

            /*Previous Month First & Last Dates*/
            var prevfirstday = new Date(dt.getFullYear(), dt.getMonth() - 1, 1);
            prevfirstday = prevfirstday.toDateString();
            var prevlastday = new Date(dt.getFullYear(), dt.getMonth(), 0);
            prevlastday = prevlastday.toDateString();

            if (selectedValue == 'today') {
                var lblHead = 'Todays Sales of ' + selectedZone + ' @ ' + dt;
                document.getElementById('<%=lblStoreName.ClientID %>').innerHTML = lblHead;
            }
            else if (selectedValue == 'yesterday') {
                var lblHead = 'Sales Report of ' + selectedZone + ' on ' + ytd;
                document.getElementById('<%=lblStoreName.ClientID %>').innerHTML = lblHead;
            }
            else if (selectedValue == 'mtd') {
                var lblHead = 'Sales Report of ' + selectedZone + ' from ' + firstdate + ' to ' + ytd;
                document.getElementById('<%=lblStoreName.ClientID %>').innerHTML = lblHead;
            }
            else if (selectedValue == 'prevmonth') {
                var lblHead = 'Sales Report of ' + selectedZone + ' From ' + prevfirstday + ' to ' + prevlastday;
                document.getElementById('<%=lblStoreName.ClientID %>').innerHTML = lblHead;
            }
            else if (selectedValue == 'ytd') {
                var lblHead = 'Sales Report of ' + selectedZone + ' From 1 April 2015 to ' + ddt;
                document.getElementById('<%=lblStoreName.ClientID %>').innerHTML = lblHead;
            }


            $.ajax({
                url: '<%=ResolveUrl("~/Corporate/Sales.aspx/GetStoreData") %>',
                data: "{'rbtlSales':'" + selectedValue + "','rbtnStore':'" + selectedZone + "'}",
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                success: function(data) {
                    var labels = [];
                    var datas = [];
                    $.each(data.d, function(i, item) {
                        var l = item.split('/')[0];
                        var d = item.split('/')[1];
                        var dd = d | 0;
                        labels.push(l);
                        datas.push(dd);
                    });
                    var barChartLocData =
            {
                labels: labels,
                datasets:
                [
                    {
                        fillColor: "lightgreen",
                        highlightFill: "lightgreen",
                        data: datas
                    }
                ]
            };
                    var ctx = document.getElementById("canvas").getContext("2d");
                    new Chart(ctx).HorizontalBar(barChartLocData, {
                        responsive: true,
                        scaleFontColor: "#000",
                        showTooltips: false,
                        onAnimationComplete: function() {
                            var ctx = this.chart.ctx;
                            ctx.font = this.scale.font;
                            ctx.fillStyle = this.scale.textColor
                            ctx.textAlign = "right";
                            ctx.textBaseline = "right";
                            this.datasets.forEach(function(dataset) {
                                dataset.bars.forEach(function(bar) {
                                    ctx.fillText(bar.value, bar.x, bar.y - 5);
                                });
                            });
                        }
                    });
                },
                error: function(response) {
                },
                failure: function(response) {
                }
            });
        });
    });

<asp:RadioButton ID="rbtnZone" runat="server" GroupName="rb" Text="Zone Wise" />
 
<asp:RadioButtonList ID="rbtnStore" runat="server" CellPadding="3" GroupName="rb" RepeatColumns="4" RepeatDirection="Horizontal">
</asp:RadioButtonList>

<!-- begin snippet: js hide: false -->

Answer 1

您可以使用以下代码：

$(document).ready(function (){
if($('#rbtnZone').is(':checked')){
    $('#rbtnStore').attr('checked',false)
}
else if($('#rbtnStore').is(':checked')){
    $('#rbtnZone').attr('checked',false)
}

$('#rbtnZone').on('change',function (){
    if($(this).is(':checked')){
        $('#rbtnStore').attr('checked',false)
    }
});

$('#rbtnStore').on('change',function (){
    if($(this).is(':checked')){
        $('#rbtnZone').attr('checked',false)
    }
});
});

Answer 2

您可以使用此代码

stream.Multicast(new Subject<T>())

Answer 3

我有一个解决方案......

$(document).ready(function() {
    $("[id*=rbtnZone]").click(function() {
        $('#<%=rbtnStore.ClientID %> input:radio').each(function() {
            $(this).prop('checked', false);
        });
    });

    $("[id*=rbtnStore]").change(function() {
    $('#<%=rbtnZone.ClientID %>').prop('checked', false);
    });

});

感谢顺便帮忙...

Answer 4

一旦你选择了所需的Radio thow DOM，你只需说明：

Radio.setValue(true/false);

将根据您的需要进行检查。

如何使用javascript检查/取消选中单选按钮

4 个答案: