jQueryを利用したAjaxでのXML読み込みについてです。

Question

###前提・実現したいこと
こんにちは。
web初心者ですので基本的なことかも知れませんがよろしくお願いします。
今回，html上のボタンを押したとき，javascriptの関数を呼び出し，ajax でxmlを読み込んで要素の一部に反映させる，ということをやりたいと思っています。

###発生している問題

ボタンを押したとき，関数は呼ばれるのですが，ajaxがうまくいかないようで，結果がfailになってしまいます。

###該当のソースコード

var now_panel = "index";
	
function ajaxGetPanel(element){
	
	//今のパネルと同じパネルには飛ばない
	if(now_panel == String(element.id)) return;
	
	var link = "xml/" + String(element.id) + ".xml";
	now_panel = String(element.id);

	$.ajax({
		type: 'get',
		url: link,
		dataType: 'xml',
		cache: false,
		async: true
	}).done(function(data){
		$(data).find("title").each(function(){
			alert("debug_done");
			$(".panel-title").text($(this).text());
		});				
	}).fail(function(){
		alert("debug_XML_ERROR");
	});
	
}

###補足情報(言語/FW/ツール等のバージョンなど)
開発ツール: DreamWeaver CC2017
ブラウザ: safari10.0.3, Google Chrome56.0.2924.87

Comments

[kei344]

サーバ上での話でしょうか。それともローカル環境での話でしょうか。

[___asymptote___]

質問ありがとうございます。rasipberry pi で構築したサーバー上での事です。

[kei344]

エラーは出ていませんか？デベロッパーツールで確認してみてください。http://eng-entrance.com/javascript-display-error

[___asymptote___]

ありがとうございます。Google Chromeのデベロッパーツールで確認してみましたところ，紹介していただいたURLにあるような「javascript開始」のログすら出ず，何も出ません。しかしjavascriptによるalertは表示されます。また，htmlで作成したリンクを踏むと「Navigated to (リンク先のアドレス)」というログが出ます。

Answer 1

    }).fail(function(jqxhr, status, error){
        alert("debug_XML_ERROR " + status + " " + error);
    });

failのコールバック関数をこう変えてみて、どんなエラーが起きているか確認してください。原因がわかるかもしれません。

Comments

[___asymptote___]

回答ありがとうございます。
ご指摘のようにしてみたところ，
parsererrorが出力され，内容はInvalid XMLでした。
この内容を元にまた調べてみようと思います。
また分からなくなってしまったら質問させていただくことがあるかも知れませんが，そのときはまた是非よろしくお願いします。

[masaya_ohashi]

Invalidというのは「無効な」という意味です。おそらくダウンロードしてくるxmlが、正しいXMLの形式になっていないのでしょう。XMLは厳密なルールが定められていて、例えば開きタグ、閉じタグの数が合わないとすぐエラーになります。よくxmlの中を見てチェックしてみましょう。もしそのxmlが個人情報や秘密にしたい内容が一切ないのであれば、オンラインのXMLバリデータを使って「どこがおかしいのか」を聞いてみるのもよいでしょう。XML Validator→http://memopad.bitter.jp/w3c/xml/xml_validator.html

Answer 2

.fail(function(XMLHttpRequest, textStatus, errorThrown)){
console.log(textStatus)
}

で詳細を確認してみてください
parseerrorなど発生していませんか？
もしそうなら出力側のxml形式が間違っているかもしれません
dataTypeをいちど'text'にして戻り値を確認するとよいかもしれません
（textはあくまでも戻り値を確認するためなので、それだけでは
解決するわけではありません）

Comments

[___asymptote___]

回答ありがとうございます。
ご指摘のようにしたところ，コンソールにparsererrorが出力されました。
どうやらおっしゃるとおりxmlに問題がありそうなので，もう一度その線で調べ直してみたいと思います。
また分からなくなってしまったら質問させていただくかも知れませんが，そのときは是非よろしくお願いします。

[yambejp]

しつこいようですが$.ajaxで詰まった場合は「dataTypeをtextにしてデバグ」が原則ですので覚えておいてください

[___asymptote___]

ありがとうございます。
しっかりと覚えておきます！