0

MVC と JQuery は初めてです。私の要件は簡単です。私には 3 つのタブがあり、最初のタブにはいくつかの日付ピッカー フィールドとボタンがあります。2 番目と 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 に答える