dポイントプレゼントキャンペーン実施中！

検索結果を別フレームに表示したい

解決済

  • 質問者：xxx_869_xxx
  • 質問日時：
  • 回答数：5件

ひどく初歩的な質問かとは思いますが、教えて頂きたいです。

Fessという全文検索システムを利用した検索サイトを構築しています。
http://fess.codelibs.org/ja/articles/article-4.h …

上のページのソースを使って、検索フォームを作成したのですが、
検索結果を同ページ内では無く、別フレームに表示したいです。
<div id="subheader"></div>
<div id="result"></div>
の部分をどうにかすれば良いのかな、とは思っているのですが
皆目見当が付かないため、ご教授宜しくお願い致します。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>検索サイト</title>
</head>
<body>
<div id="header">
<form id="searchForm">
<input id="searchQuery" type="text" name="query" size="30"/>
<input id="searchButton" type="submit" value="検索"/>
<input id="searchStart" type="hidden" name="start" value="0"/>
<input id="searchNum" type="hidden" name="num" value="20"/>
</form>
</div>
<div id="subheader"></div>
<div id="result"></div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9. …
<script type="text/javascript" src="fess.js"></script>
</body>
</html>

質問者からの補足コメント

  • 質問がわかりにくくてすみません。
    下のようにフレームを3つに分けたhtmlファイル

    <html>
    <frameset rows="28%,*">
    <frame name="main">
    <frameset cols="18%,*">
    <frame name="frame1">
    <frame name="frame2">
    </frameset>
    </html>

    ┌───────────────────┐
    │　　　　　　　　main　　　　　 　　　│
    │───────────────────│
    │　　　　　　　　　│　　　　　　　　　│
    │　　　frame1　　 │　　　　　 　　　│
    │　　　　　　　　　│　　　　　　　　　│
    └───────────────────┘
    のmainフレームに検索フォームを作成し、
    その検索結果をframe1に出力したいのです。

      補足日時：2015/02/06 11:17
    通報する

  • mainに表示する検索フォームは上に書いたhtmlファイルで表示しているのですが、
    検索処理はjavascriptで行っています。
    http://fess.codelibs.org/ja/articles/article-4.h …のjsファイルを参考に作成しています。

    こちらのjsファイルに
    f.target="frame1"等を追記しても、fram1に
    「405 - このページへのアクセスに使用された HTTP 動詞は許可されていません。」
    と表示されてしまいます。

    mainに表示するhtmlファイルではいくつかの検索フォーム(aspファイル)があり、
    <base target="frame1">の記入もしてあります。
    他のフォームは正しくframe1に表示されます。

      補足日時：2015/02/06 11:40
    通報する

  • HTMLが置いてあるサーバーとFessサーバーは同ドメインですので、JSONPは利用していません。
    リクエストパラメータにcallbackは利用していません。
    また、フレームも同ドメインであるため、クロスドメインにはひっかかりません。

    お恥ずかしながら、ご回答頂いた内容がいまいち理解できておらず、
    どのスクリプトに何を追記すべきかがわかりません。

    jsファイルに（別フレームのdocument).(通常のDOM処理メソッド等～～）にあたる追記をすれば宜しいのでしょうか？

    No.3の回答に寄せられた補足コメントです。 補足日時：2015/02/06 16:20
    通報する

  • jsファイルの中身を見落としていました
    var $result = $('#result'),
    buf = [];
    //検索結果領域クリア
    $result.empty();
    //検索結果出力
    var $resultBody = $("<ol/>");
    var results = dataResponse.result;
    for(i = 0, max = results.length; i < max; i++) {
    buf = [];
    buf.push('<li>**略**</li>');
    $(buf.join("")).appendTo($resultBody);
    $resultBody.appendTo($result);
    の$resultを置き換えれば良いでしょうか？

    No.4の回答に寄せられた補足コメントです。 補足日時：2015/02/13 16:06
    通報する
通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (5件)

No.4ベストアンサー

  • 回答者： fujillin
  • 回答日時：

ANo3です。




＞JSONPは利用していません
ajaxでデータを取得しているのはあってますよね？


データをjsonで取得しているのか、他の形式で取得しているのかわかりませんが、ajaxをご利用なら、ご使用のスクリプトは大きく分けて、
　1）サーバにリクエストを送る処理
　2）データを受取り、ブラウザに表示する処理
とからなっていると想像します。

1）の部分は変更する必要はありません。
2）の部分でHTMLのDIVやSPAN等の内容にデータを反映している処理（=DOM操作)で、対象とする要素を例えば、
　document.getElementById(～～)
等のような方法で特定していると想像しますが、この時のdocumentはスクリプトがあるdocumentObject（=HTML文書）を意味しています。
他フレームの文書（=別のHTML文書）にデータを反映したい場合は、他フレームの文書（documentObject）のDIVやSPAN（=DOM）を対象とするように修正する必要があります。

上記のgetElementById()を例にすると、
　（他フレームのdocumentObject).getElementById(～～)
などとすることで、対象をそのフレーム内の要素として指定することができます。
具体的には
　parent.frames["hoge"].document.getElementById(～～)
のような記述になると思います。
上記のような修正を、表示処理の対象を指定している部分に対して行ってください。


詳細な説明は、検索するか、ANo3のリンク先から辿れると思います。
この回答への補足あり
    • good
    • 0
    • 件
通報する

No.5

  • 回答者： DoubtOwl
  • 回答日時：

fessの検索結果を直接参照するところでWebサーバーの制限にひっかかっていると思うのですが。



サーバーの制限が変えられないのであれば
検索処理の前にシンプルなInnerFrameを持つHTMLを開き、開いたHTMLのInnerFrameを表示対象にしてみては如何でしょうか？
    • good
    • 0
    • 件
通報する

だいじょうぶ

No.3

  • 回答者： fujillin
  • 回答日時：

参考サイトにある方法のうちで・・・



ajaxでデータを取得していて、jsonpでcallback利用の処理を行っているのでしょうか？
（他の方法でもajaxで送受信しているのなら同様ですが・・・）

データを受け取ってからhtmlに出力（表示）していると思いますが、その中で表示する対象を別フレームに変えてあげる必要があります。
別フレーム内のdocumentは、スクリプトがあるdocumentとは別物なので、そちらのDOMに表示するようにスクリプトを変えてあげればよろしいかと思います。

イメージ的には
　（別フレームのdocument).(通常のDOM処理メソッド等～～）
のような形式になります。
スクリプトの記述方法によっては、一番トップの要素の取得部分だけを変えてあげれば、それだけでＯＫということになるかも知れません。

具体的な方法としては
http://www.bing.com/search?q=javascript+%E5%88%A …


※フレームがそれぞれ別ドメインの場合は、さらなる工夫が必要になります。
　（クロスドメインの禁止があるので）
この回答への補足あり
    • good
    • 0
    • 件
通報する

No.2

  • 回答者： DoubtOwl
  • 回答日時：

405エラーだと別問題ですね。



http://www.pdf-nosave.com/faq/iis_post/
http://qa.atmarkit.co.jp/q/1445
このあたりが参考になるかと思うのですが・・・
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： DoubtOwl
  • 回答日時：

resultに表示したいのですかね？



・別ウインドウに表示
<form id="searchForm" target="_blank">

・フレームに表示
<form id="searchForm" target="フレームのname">

例）
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>検索サイト</title>
</head>
<body>
<div id="header">
<form id="searchForm" target="resultFrame">
<input id="searchQuery" type="text" name="query" size="30"/>
<input id="searchButton" type="submit" value="検索"/>
<input id="searchStart" type="hidden" name="start" value="0"/>
<input id="searchNum" type="hidden" name="num" value="20"/>
</form>
</div>
<div id="subheader"></div>
<div id="result">
<iframe name="resultFrame"><iframe>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9. …
<script type="text/javascript" src="fess.js"></script>
</body>
</html>
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報