1

私の状況の序文として、私は ASP.NET (C#) と jQuery を使用していることに注意してください。

レイアウトは次のとおりです。ページの水平方向の長さ全体にまたがるトップ div (ヘッダー/メニュー) があります。このヘッダー/メニューの下に、他に 2 つの div があります。左の div は、ページへのリンクを含むナビゲーション div です。右の div は、左の div のリンクから Ajax によって読み込まれたページの表示 div です。

これを描けるかどうか見てみよう...

=====================================================
= Top Div              (header/menu)                =
=====================================================
=               =                                   =
=               =                                   =
=               =                                   =
=               =                                   =
= Left Div      =  Right Div                        =
= (Navigation)  =  id = "rightdiv"                  =
=               =  (Displays content loaded by      =
=               =   Ajax from the links in the      =
=               =   left div)                       =
=               =                                   =
=               =                                   =
=               =                                   =
=               =                                   =
=====================================================

この時点まで、すべて正常に動作します。左の div のリンクをクリックして、jQuery... を使用して右の div にロードできます$('#rightdiv').load('pagenamehere.aspx');

これが問題です...

右の div に読み込んでいるページには、UpdatePanel (ページごとに 1 つ) が含まれています。UpdatePanel 内のボタン (UpdatePanel 自体のコンテンツのみを更新する必要があります) をクリックすると、代わりに右の div からコンテンツが取り出され (実際にはそのページに移動します)、UpdatePanel のコンテンツが訪問したかのように更新されます。そのページ自体とボタンを押しました。

私の質問は...

これを防ぎ、Ajax を使用して取り込まれたページで UpdatePanel を機能させるにはどうすればよいですか?

ここにいくつかの追加の(奇妙な)情報があります...

レイアウト全体が読み込まれた元の時刻を表示します ('5/23/2013 10:15:11 AM')。

ページの右側の div に Ajax を実行し、ロードされた時刻を表示します (そのページ自体ではありますが、UpdatePanel の外側にあります) ('5/23/2013 10:15:17 AM')。これは、レイアウトがロードされてから数秒後に左の div のページ リンクをクリックしたことを示しています。

ボタンを押して UpdatePanel を更新すると、UpdatePanel 自体の内部でボタンを押した時刻が表示されます ('5/23/2013 10:15:28 AM')。この時点で、右側の div からページを引き出し (最初からこのページに移動したかのように)、このページが右側の div に読み込まれた元の DateTime を保持します ('5/23/2013 10 :15:17 AM')。

=====

UpdatePanel と ScriptManager を変更してこれを行わないようにするためにあらゆる方法で形状とフォームを試しましたが、役に立ちませんでした。

UpdatePanel をすべてのコンテンツ ページではなく、適切な div の周りに配置することも試みました (そのため、Ajax を使用して読み込まれたページは、ポストバック時にのみその div を更新します)。

Ajax経由でロードされたページにUpdatePanelを配置する方法があると確信していますが、実際の例やこれに対する答えがどこにも見つからないようです。

どんな助けでも大歓迎です。ありがとう。

編集1:

左の div で行われた検索 (Ajax によって取り込まれた) が、右の div のコンテンツが PostBack を実行するときに失われることは望ましくありません (したがって、UpdatePanel が必要です)。右の div から PostBack を実行すると、右の div のコンテンツだけでなく、レイアウト全体が更新されます。

編集2:

これは、私たちが達成しようとしていることの単純な例にすぎないことを明確にしておく必要があります。右の div (.aspx ページ全体) のコンテンツを PostBack する必要がありますが、UpdatePanel 内でのみ行います。右側の div ページの PostBack でレイアウト全体 (上部の div、左側の div、および右側の div) が更新されないように、この機能が必要です。

基本的に、上と左の div を変更せずに、右の div で PostBack できるようにする必要があります。Ajax 経由で適切なページを取り込むと、右側のページの UpdatePanel はレイアウトを尊重していないようで、レイアウトから外れます。

4

2 に答える 2

2

完全なページをロードすると、HTML が壊れているようです。.load() は特定の HTML 要素を取り除きますが、余分な <title> タグなどを挿入している可能性があります。

以下は、2 つのファイルを使用した簡単な例です。

to-be-loaded.html

<!DOCTYPE html>
<html>
<head>
<title>To Be Loaded</title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
  <div id="my-div"></div>
  <script>
    $("#my-div").load('/load-me.html #load-me ul');
  </script>
</body>
</html>

load-me.html

<!DOCTYPE html>
<html>
<head>
<title>Load Me</title>
</head>
<body>
<div id="load-me">
  <ul>
    <li>First Item</li>
    <li>Second Item</li>
 </ul>
</div>
</body>
</html>

load 呼び出しの実行後、div#my-div には load-me.html の順序付けられていないリストの内容が含まれます。

于 2013-05-23T15:37:46.053 に答える