タブのコンテンツを動的にロードしようとしています。ソースは [WebMethod] 属性で修飾された ASP.NET メソッドです。
[WebMethod]
public static string Result()
{
return RenderControl("WebUserControl1.ascx");
}
タブが次のコードによって読み込まれると、正常に動作します。
<div id="tabs">
<ul>
<li><a href="#tabs-1">Dynamic User Control</a></li>
</ul>
<div id="tabs-1">
</div>
</div>
$.ajax({
type: "POST",
url: "WebForm1.aspx/Result",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
$('#tabs-1').html(msg.d);
},
error: function (msg){
$('#tabs-1').html('Cannot load');
}
});
ただし、タブの定義が異なる場合:
<div id="tabs">
<ul>
<li><a href="WebForm1.aspx/Result">Dynamic user Control</a></li>
</ul>
<div id="tabs-1">
</div>
</div>
次に、この呼び出しにより、ページ コンテンツ全体が読み込まれ、タブに配置されます。したがって、データ型を json に変更しようとしましたが、タブ全体の読み込みが ajax 呼び出し内のどこかで失敗します。
$("#tabs").tabs({
beforeLoad: function (event, ui) {
ui.ajaxSettings.accepts = { json: "application/json, text/javascript" };
ui.ajaxSettings.contentType = "application/json; charset=utf-8";
ui.ajaxSettings.type = "POST";
ui.ajaxSettings.dataTypes[0] = "json";
ui.jqXHR.error = function () {
$('#tabs-3').html('Cannot load');
}
},
});
リクエストとともに送信されるヘッダーを確認しましたが、ajaxSettings へのこれらの変更はサーバーにまったく送信されません。
正しい方向に向けてください。
使用する JQuery-UI のバージョンは 1.10.0 です。使用する JQuery のバージョンは 1.9.0 です。
編集: Content-Type ヘッダーが ajaxSettings に従って application/json に設定されていないことを Firebug で確認しました。したがって、Web ページは text/html 応答で応答しました。リクエスト ヘッダーが json に強制された場合 (ライブ ヘッダー Firefox アドオンによって)、json レスポンスが返されることを確認しました。タブに正しい http ヘッダーを強制的に渡す方法はありますか?