私はプラグインの公開側の作成に取り組んでおり、Mura の外部で同じコードを実行したとき、または jsfiddle で実行したときに発生しない JavaScript エラーが発生します。
JavaScriptはかなり簡単です。別の選択の値に基づいてフォームの選択を設定します。これは、単独で動作するhtmlとjavascriptのjsfiddleです。 http://jsfiddle.net/P7ZTz/2/
プラグインの公開ビューには、次のものがあります。
<cfset rc.$.loadJSLib() />
<cfset rc.pc.addToHTMLHeadQueue("addendaJsInclude.cfm")>
<form name="form" method="post" action="addenda2.cfm" onSubmit="return checkrequired(this)">
<select name="mRoute" onchange="javascript:populateData(this.options[selectedIndex].text)">
<option value="">Select Route</option>
<option value="Route 3">Route 3</option>
<option value="Route 2">Route 2</option>
<option value="Route 1">Route 1</option>
</select>
<select name="mSection">
<option value="">Section</option>
</select>
<input type="submit" name="submit">
</form>
addendaJsInclude.cfm ファイルには次のものが含まれています。
var arrayData = new Array();
arrayData[0] = 'Route 1|1|'
arrayData[1] = 'Route 1|2|'
arrayData[2] = 'Route 1|3|'
arrayData[3] = 'Route 1|4|'
arrayData[4] = 'Route 1|5|'
arrayData[5] = 'Route 1|6|'
arrayData[6] = 'Route 1|7|'
arrayData[7] = 'Route 2|1|'
arrayData[8] = 'Route 3|1|'
function populateData( name ) {
select = window.document.form.mSection;
string = "";
count = 1;
select.options.length = count;
for( i = 0; i < arrayData.length; i++ ) {
string = arrayData[i].split( "|" );
if( string[0] == name ) {
select.options[count++] = new Option( string[1] );
}
}
}
function checkrequired(which) {
var pass=true;
if (document.images) {
for (i=0;i<which.length;i++) {
var tempobj=which.elements[i];
if (tempobj.name.substring(0,1)=="m") {
if (((tempobj.type=="text"||tempobj.type=="textarea")&&
tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&
tempobj.selectedIndex==0)) {
pass=false;
break;
}
}
}
}
if (!pass) {
shortFieldName=tempobj.name.substring(1,12).toUpperCase();
alert("Please select a "+shortFieldName+".");
return false;
}
else
return true;
}
ブラウザでページを実行すると、コンソールに次のエラーが表示されます。
select is undefined
select.options.length = count;
これはある種のスコーピングの問題のようですが、私は JavaScript の初心者であり、問題が何であるかを知ることができません。繰り返しますが、jsfiddle および Mura 以外の通常の html ページでは正常に動作します。クライアント側で実行されるため、Mura 出力内で動作が異なる理由が少しわかりません。html と javascript は両方とも同じように見えますが、エラーは Mura ページでのみ発生します。任意の入力をいただければ幸いです。