1

2 つのアクションを持つコントローラーと 2 つのチャートを持つビューがあります。最初のコントローラーはビュー上に直接あり、2 つ目は以下のような部分ビューです。

<div class="chart" style="margin-top: 10px;">
        @(Html.Telerik().Chart(Model)
            .Name("CustomerCount")
            .Title(title => title.Text("TotalCustomersPerHour"))
            .Legend(settings => settings.Position(ChartLegendPosition.Bottom))
            .Series(series => series.Line(p => p.CustomerCount.Total).Name("TotalCustomersPerHour"))
            .CategoryAxis(a => a.Categories(p => p.CustomerCount.Intervalo).Labels(l => l.Rotation(-40))).Theme("vista")
            .Tooltip(true)
            .HtmlAttributes(new { style = "height: 300px;" })
            .DataBinding(dataBinding => dataBinding.Ajax()
            .Select("CustomerCountData", "Indicators", new
            {
                storeId = "TR_001",
                startDate = DateTime.Today,
                endDate = DateTime.Today.AddDays(10)
            }))
            .ClientEvents(b => b.OnDataBound("OnCustomerCountDataBound"))
        )
</div>
<div class="chart" style="margin-top: 10px;">
        @Html.Partial("_ChartTest")
</div>

最初のアクションは、Telerik Chart Ajax 呼び出しによって呼び出されます。それが完了すると、ViewBags を使用して部分ビュー チャートにデータを入力するために、OnDataBound イベントによって別のアクションを呼び出します。

function OnCustomerCountDataBound(e) {
    $.ajax({
        type: "POST",
        url: "Indicators/ChartTest",
        data: { retailStoreId: "TR_001"},
    });
}

部分ビューをデバッグし、ViewBag 値を取得できますが、結果がページに表示されません。

@(Html.Telerik().Chart()
    .Name("TimeOfPermanency")
    .Title(title => title.Text(TrackerMessages.TimeOfPermanencyPerArea))
    .Legend(settings => settings.Position(ChartLegendPosition.Bottom))
    .Series(series =>
        {
            if (ViewBag.Series != null)
            {
                foreach (var area in ViewBag.Series)
                {
                    series.Column(area.Data).Name(area.Name);
                }
            }

        })
    .CategoryAxis(axis =>
    {
        if (ViewBag.Categories != null)
        {
            axis.Categories(ViewBag.Categories);
        }
    })
    .Tooltip(true)
    .HtmlAttributes(new { style = "height: 300px;" })
    .ClientEvents(b => b.OnDataBound("OnTimeOfPermanency"))
)

2 番目のグラフに結果が表示されない理由を知っている人はいますか?

ありがとう！

4

1 に答える 1

2

部分ビューをデバッグし、ViewBag 値を取得できますが、結果がページに表示されません。

これは、ajax 呼び出しの成功のコールバックで何もしていないように見えるためです。あなたはそれを購読していません。

それでは、サブスクライブして、コントローラーから返された結果でパーシャルを更新します。

function OnCustomerCountDataBound(e) {
    $.ajax({
        type: "POST",
        url: "Indicators/ChartTest",
        data: { retailStoreId: "TR_001"},
        success: function(result) {
            $('#childChart').html(result);
        }
    });
}

$('#childChart')セレクターを使用したことに注意してください。これは、2 つの要素がclass="chart"あり、2 番目の要素のみを更新したいと理解しているからです。したがって、含まれている div に一意の ID を割り当てるようにしてください。

<div class="chart" id="childChart" style="margin-top: 10px;">
    @Html.Partial("_ChartTest")
</div>
于 2013-05-29T15:01:08.457 に答える