2009-07-21 8 views
0

Asp.net MVCを使用していて、jqueryでAjax UIタブを使用しようとしています。それは、このJquery UI Tabsコンストラクタメソッドを使用するにはどうすればいいですか?

が タブリンクにhrefの値を設定することにより、 タブのAjaxを介して外部コンテンツを取得していhttp://jqueryui.com/demos/tabs/#ajax

:デモサイトで

。 が応答を待っている間に、 というラベルのラベルが「Loading ...」と変化した後、 がロードされると、 は通常のラベルに戻ります。

タブがデモに読み込まれることはありません。だから私は私のasp.net mvcアプリケーションで私は自分のexample.Aを作成しようとすることを決めた部分ビューを読み込むアクションビューにhrefを設定します。このアクションビューで私は "5000"のスリープスレッドを入れます。

しかし、私は要求とチェックを遅くしても、彼らが話しているこの「ロード....」は決して見ません。私は、コンストラクタメソッドを見ていたと私はそれが

スピナー

種類ありスピナーオプションを見ていたインスタンスのためにそれらを使用する方法を得ることはありません

: 文字列デフォルト:リモート ながら、この文字列の 「ロード…

HTMLコンテンツは タブのタイトルに示されていますコンテンツが読み込まれています。空の 文字列を渡すと、その動作が無効になります。 コード例

スピナー オプションを指定してタブを初期化します。

$('.selector').tabs({ spinner: 'Retrieving data...' }); 

initの後にスピナーオプションを取得または設定します。

//getter 
var spinner = $('.selector').tabs('option', 

'スピナー'); //セッター $( '。selector')。tabs( 'option'、 'spinner'、 'Retrieving data ...');

私は言われたことをして、私はその行を私のjqueryに入れ、私が持っている実際のdivに変更しました。

私はこのスピナーを見ないので、私は何が欠けているのか分かりません。私は他の何かをしなければならないのですか?

私のJavaScriptコード:

<script src="../../Scripts/jquery-1.3.2.min.js" type="text/javascript"></script> 
<link href="../../images/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" /> 

<script src="../../Scripts/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script> 


    <script type="text/javascript"> 
     $(function() { 

      // Tabs 
     $('#tabs').tabs({ spinner: 'Retrieving data...' }); 


     }); 
     </script> 

編集

"redSquares" ポストのおかげで私は今、鉱山が動作していない理由を知っているが、私はHtml.ActionLinkを使用しています。だから私は私のHtml.ActionLinkをスパンタグを持つように形成することができますか?あるいは、私自身のHTMLヘルパーを作らなければならないのですか?

+0

sneakyness.comでこの動作の例を見ることができます:)この回答を受け入れ、新しい質問をする方が良いだろう。このサイトを検索し、Googleを介して正しい情報を見つけるのに役立ちます – redsquare

+0

しかし、次の質問に答えるには、http://stackoverflow.com/questions/402605/create-an-actionlink-with-html-elements-in-the-リンクテキスト – redsquare

答えて

2

あなたが最初におそらくあなたの文書レディ機能では、タブを開始しているところはどこでもそのスピナー部分を配置する必要があります。 tabs.tabs(x)の中に{spinner: 'Retrieving data ...'}を入れてください。

ほとんどの場合、それは非常に速く読み込まれますが、それは見えません。それは良い問題です。

は新しい問題である私の現在のプロジェクト

0

アンカー内にスパンを配置する必要があります。これを説明するニースのドキュメント!

例えば

<ul> 
    <li><span><a href="someUrl"><span>Spinner Needs this</span></a></li> 
    <li><a href="shomeUrl1"><span>Spinner Needs this</span></a></li>  
</ul> 

デモhere

関連する問題