0

我是 MVC 和 JQuery 的新手。我的要求很简单。我有 3 个选项卡,第一个选项卡有几个日期选择器字段和一个按钮。第 2 和第 3 个选项卡显示基于所选日期的图表。当我单击第一个选项卡中的按钮时,我需要填充第二个和第三个图表(图像)。

这是我的 aspx 文件的内容 $(function () { $("#tabs").tabs(); });

<script type="text/javascript">
    $(document).ready(function () {
        $("#StartDate").datepicker({ dateFormat: 'dd/mm/yy' });
    });
    $(document).ready(function () {
        $("#EndDate").datepicker({ dateFormat: 'dd/mm/yy' });
    });
 </script>

<div id="tabs">
        <ul>
            <li><a href="#tabs-DS">Data Selection</a></li>
            <li><a href="#tabs-CI">Carbon Impact</a></li>   
            <li><a href="#tabs-ED">Energy Demand</a></li>
        </ul>
        <div id="tabs-DS">
 <p> Trial </p>
         <select trialname="SMTrial">
          <option value="SMR">Residential Smart Metering</option>
         </select>

         <p></p>
            <% Html.BeginForm("GetSmartMeterData", "Trials");%>
                <p>Start Date</p>
                <%= Html.TextBoxFor(model => model.StartDate , new { style = "width:100px" })%>

                <p>End Date</p>
                <%= Html.TextBoxFor(model => model.EndDate, new { style = "width:100px" })%>

                <input type="button" id="but1" value="Go" onclick="location.href='<%:Url.Action("GetSmartMeterData", "Chart") %>'" />

            <% Html.EndForm();%>


        </div>
        <div id="tabs-CI">

        </div>
        <div id="tabs-ED">

        </div>
 </div>

当我单击按钮时,使用此代码,它只是在空白页上绘制图形,但我希望它在我的选项卡“tabs-CI”中呈现。

4

1 回答 1

0

尝试这个:

<% Ajax.BeginForm("GetSmartMeterData", "Chart", new AjaxOptions{ UpdateTargetId = "tabs-CI" });%>
     <p>Start Date</p>
     <%= Html.TextBoxFor(model => model.StartDate , new { style = "width:100px" })%>

     <p>End Date</p>
     <%= Html.TextBoxFor(model => model.EndDate, new { style = "width:100px" })%>

     <input type="submit" id="but1" value="Go" />

<% Ajax.EndForm();%>
于 2013-07-17T09:17:41.147 回答