0

jquery ui タブを js および mvc3 と一緒に使用しようとしています。

   <div class="demo">
        <div id="tabs">
            <ul>
                <li><a href="#tabs-1">Tab One</a></li>
                <li><a href="#tabs-2">Tab Two</a></li>
            </ul>
            <div id="tabs-1">
                <p>  </p>
            </div>
            <div id="tabs-2">
                <p>  </p>
            </div>
        </div>
   </div>

Jsファイル

function GetTabData(xdata) {
    $.ajax({
        url: ('/Home/GetTabData'),
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify({ id: xdata }),

        success: function (result) {
            alert("OK !");
        },
        error: function () { alert("error"); }
    });
}

MVC3

public ActionResult GetTabData(string xdata)
{
    data = fetch data and return to the calling script    
    return PartialView("_TabDataPartial", data);
}

したがって、質問は非常に基本的なもので、js GetTabData() 呼び出しを TabOne および TabTwo にバインドする方法です。

ありがとう。

4

2 に答える 2

1

試す :

 $('a').click(function(e) { 
  e.preventDefault();   
  alert($(this).attr('href'));
 //Call GEtdata here
});

また、これを変更する必要があります

 public ActionResult GetTabData(string xdata)

 public ActionResult GetTabData(string id)

からの呼び出しidであなたの送信をcozdataajax

于 2012-07-19T18:14:43.200 に答える
0

HTML5 データ属性を利用して、次の方法でリンクを定義できます。

 <a href="#tabs-1" data-tabId="1" class="tabLink">Tab One</a>

次に、js で on click イベントをバインドして、次のことを行います。

$('.tabLink').on('click', function() {
    var id = $(this).data('tabId');
    GetTabData(id);
});
于 2012-07-19T18:03:09.203 に答える