FAQ |
Kalender |
2008-10-29, 21:14 | #1 | ||
|
|||
Flitig postare
|
Jag har skapat ett objekt med Prototype's Class.create och det fungerar bra i FF och Safari, men inte i IE. I IE får jag felmeddelande: 'SaveDialog' är odefinierad.
Så här ser koden ut och jag kan inte se var felet kan tänkas ligga: Kod:
var SaveDialog = Class.create({ initialize: function(data, options, getContentsOptions, saveContentsOptions, newFolderOptions) { this.data = data; this.options = { name: '', directory: '', folder: 0, list: 'smallIcons', onFolderClick: Prototype.emptyFunction, onFileClick: Prototype.emptyFunction, onSave: Prototype.emptyFunction, onCancel: Prototype.emptyFunction }; this.getContentsOptions = { url: 'ajax.php', method: 'get', parameters: '', }; this.saveContentsOptions = { url: 'ajax.php', method: 'post', parameters: '', }; this.newFolderOptions = { url: 'ajax.php', method: 'post', parameters: '', }; this.elements = { folder: '', file: '' }; this.currentID = 0; this.parentID = 0; this.xmlDoc; this.list = new Array(); this.selected; Object.extend(this.options, options || { }); Object.extend(this.getContentsOptions, getContentsOptions || { }); Object.extend(this.saveContentsOptions, saveContentsOptions || { }); Object.extend(this.newFolderOptions, newFolderOptions || { }); this._print(); }, // Skriv ut gränssnitt _print: function() { strContent = '<div id="dialogContainer" style="position:absolute; top:60px; left:400px; border:1px solid #000; width:500px; background:#f0f0f0; padding:5px;">' + "\n" + ' <div id="dialogToolbar" style="padding:3px; text-align:right">' + "\n" + ' <input type="image" id="dialogImgGoBack" name="dialogImgGoBack" src="images/icons/arrow_left.png" /><input type="image" id="dialogImgAddFolder" name="dialogImgAddFolder" src="images/icons/folder_add.png" /><input type="image" id="dialogImgDeleteFolder" name="dialogImgDeleteFolder" src="images/icons/folder_delete.png" /><input type="image" id="dialogImgDeleteFile" name="dialogImgDeleteFile" src="images/icons/page_delete.png" />' + "\n" + ' </div>' + "\n" + ' <div id="dialogPaths" style="padding:5px; border:2px inset #e1f6e6; background:#fff; width:485px; height:250px; overflow:auto;">Hämtar mappar...</div>' + "\n" + ' <div id="dialogFormContainer" style="padding:5px;">' + "\n" + ' <form id="dialogForm" name="dialogForm" style="display:inline;">' + "\n" + ' <label for="dialogName">Namn:</label>' + "\n" + ' <input type="text" id="dialogName" name="dialogName" size="40" />' + "\n" + ' <input type="button" id="dialogBtnSave" name="dialogBtnSave" value="Spara" />' + "\n" + ' <input type="button" id="dialogBtnCancel" name="dialogBtnCancel" value="Avbryt" />' + "\n" + ' </form>' + "\n" + ' </div>' + "\n" + '</div' + "\n"; $("container").insert(strContent); this._showFolders("parentID=" + this.options.folder); Event.observe('dialogName', 'blur', this.onUnfocus.bindAsEventListener(this)); Event.observe('dialogBtnSave', 'click', this.onSave.bindAsEventListener(this)); Event.observe('dialogBtnCancel', 'click', this.onCancel.bindAsEventListener(this)); Event.observe('dialogImgGoBack', 'click', this._onGoBack.bindAsEventListener(this)); Event.observe('dialogImgAddFolder', 'click', this._createNewFolder.bindAsEventListener(this)); Event.observe('dialogImgDeleteFolder', 'click', this._onDelete.bindAsEventListener(this)); Event.observe('dialogImgDeleteFile', 'click', this._onDelete.bindAsEventListener(this)); }, // Hämta kategorier och artiklar och spara dem i list-vektorn _showFolders: function() { $A($$("div#dialogContainer input")).each(function(input) { $(input).disable(); }); var params = this.getContentsOptions.parameters + (arguments[0] ? "&" + arguments[0] : ''); dialog = this; new Ajax.Request(this.getContentsOptions.url, { method: this.getContentsOptions.method, parameters: params, onLoading: function(transport) { $("dialogContainer").setStyle({cursor: "wait"}); }, onComplete: function(transport) { if (transport.status == 200) { dialog.list.clear(); dialog.xmlDoc = transport.responseXML.documentElement; dialog.parentID = dialog.xmlDoc.getElementsByTagName('parent')[0].childNodes[0].nodeValue; dialog._fillList(); dialog._outputList(dialog.options.list); $A($$("div#dialogContainer input")).each(function(input) { $(input).enable(); }); $("dialogName").focus(); $("dialogContainer").setStyle({cursor: "auto"}); } }}); }, // Skapa en vektor av xmldokumentet _fillList: function() { folders = this.xmlDoc.getElementsByTagName('folder'); for (i=0; i<folders.length; i++) { id = folders[i].getElementsByTagName('folderid')[0].childNodes[0].nodeValue; name = folders[i].getElementsByTagName('name')[0].childNodes[0].nodeValue this.list[i] = new Array(); this.list[i][0] = true; this.list[i][1] = id; this.list[i][2] = name; } if (arguments.length > 0) { listlength = this.list.length; for (i=0; i<arguments.length; i++) { parts = arguments[i].split(":"); index = listLength+i; this.list[index] = new Array(); this.list[index][0] = (parts[0] == 'true' ? true : false); this.list[index][1] = parts[1]; this.list[index][2] = parts[2]; } } if (this.xmlDoc.getElementsByTagName('content')) { listLength = this.list.length; folderContents = this.xmlDoc.getElementsByTagName('content'); for (i=0; i<folderContents.length; i++) { id = folderContents[i].getElementsByTagName('contentid')[0].childNodes[0].nodeValue; name = folderContents[i].getElementsByTagName('contentname')[0].childNodes[0].nodeValue; index = listLength+i; this.list[index] = new Array(); this.list[index][0] = false; this.list[index][1] = id; this.list[index][2] = name; } } }, // Hämta id från den klickade foldern _getParentID: function(folderID) { id = folderID.slice(7); return id; }, // Byt cssklass. Används för hovereffekt _toggleClass: function(obj, className) { $(obj).toggleClassName(className); }, // Kolla om namnet redan finns i list-vektorn... _nameExists: function() { var exists = false; for (i=0; i<this.list.length; i++) { if ($P.in_array(this.name, this.list[i]) && this.list[i][0] == false) { exists = true; break; } } return exists; }, // Hämta rätt gränsnitt för folder artikel-lista _outputList: function(type) { // Type kan vara en av tre: // - (smallIcons) Små ikoner: Ikon + namn, 1 kolumn // - (list) Lista: Ikon + namn, x kolumner med 10 rader i varje // - (summery) Sammanfattning: Ikon + namn + filtyp, 1 kolumn switch(type) { case "smallIcons": this._smallIconsList(); break; case "list": this._listList(); break; case "summery": this._summeryList(); break; default: this._smallIconsList(); } this.options.list = type; this._setEvents(type); }, // Rita upp Sma ikoner-lista _smallIconsList: function() { strContents = '<ul id="dialogFoldersFilsList">' + "\n"; for (i=0; i<this.list.length; i++) { if (this.list[i][0] == true) { strContents += ' <li class="out" rel="folder"><img id="folder_' + this.list[i][1] + '" src="images/icons/folder.png" border="0" /> <span id="foldername_' + this.list[i][1] + '">' + this.list[i][2] + '</span></li>' + "\n"; } else { strContents += ' <li class="out" rel="file"><img id="folder_' + this.list[i][1] + '" src="images/icons/page.png" border="0" /> <span id="filename_' + this.list[i][1] + '">' + this.list[i][2] + '</span></li>' + "\n"; } } strContents += '</ul>' + "\n"; $("dialogPaths").innerHTML = strContents; }, // Rita upp Lista-lista _listList: function() { var strContents = '<table width="100%" border="0" cellpadding="1" cellspacing="1">' + "\n" + ' <tr>' + "\n" + ' <td valign="top"><ul id="dialogFoldersFilsList">' + "\n"; var rows=0; for (i=0; i<this.list.length; i++) { strContents += ' <li class="out">'; if (this.list[i][0] == true) { strContents += '<img id="folder_' + this.list[i][1] + '" alt="' + this.list[i][2] + '" src="images/icons/folder.png" border="0" /> <span id="foldername_' + this.list[i][1] + '">' + this.list[i][2] + '</span></li>'; } else { strContents += '<img id="folder_' + this.list[i][1] + '" alt="' + this.list[i][2] + '" src="images/icons/page.png" border="0" /> <span id="filename_' + this.list[i][1] + '">' + this.list[i][2] + '</span></li>'; } if (rows > 10) { strContents += ' </ul></td>' + "\n" + ' <td valign="top">' + "\n"; rows=0; } else { rows++; } } strContents += ' </td>' + "\n" + ' </tr>' + "\n" + '</table>' + "\n"; $("dialogPaths").innerHTML = strContents; }, // Rita upp Sammanfattning-lista _summeryList: function() { strContents = '<ul id="dialogFoldersFilsList">' + "\n"; for (i=0; i<this.list.length; i++) { strContents += ' <li class="out">'; if (this.list[i][0] == true) { strContents += '<img id="folder_' + this.list[i][1] + '" src="images/icons/folder.png" border="0" /> <span id="foldername_' + this.list[i][1] + '">' + this.list[i][2] + '</span></li>' + "\n"; } else { strContents += '<img id="folder_' + this.list[i][1] + '" src="images/icons/page.png" border="0" /> <span id="filename_' + this.list[i][1] + '">' + this.list[i][2] + '</span></li>' + "\n"; } } strContents += '</ul>' + "\n"; $("dialogPaths").innerHTML = strContents; }, // Sätt händelser för element i folder artikel-lista _setEvents: function(type) { dialog = this; $$("div#dialogContainer div#dialogPaths li").each(function(li) { Element.observe($(li), 'mouseover', function() { dialog._toggleClass(li, 'over') }); Element.observe($(li), 'mouseout', function() { dialog._toggleClass(li, 'over') }); }); $$("div#dialogContainer div#dialogPaths li img[src*=folder.png]").each(function(img) { Element.observe($(img), 'click', dialog.onFolderClick.bindAsEventListener(dialog)); }); $$("div#dialogContainer div#dialogPaths li img[src*=page.png]").each(function(imt) { Element.observe($(img), 'click', dialog.onFileClick.bindAsEventListener(dialog)); }); $A($$("div#dialogContainer div#dialogPaths li span")).each(function(span) { Element.observe($(span), 'click', dialog._onSpanClick.bindAsEventListener(dialog)); }); }, // Skapa en ny mapp _createNewFolder: function() { // Fyll this.list med data från XML + den nya mappen this._fillList('true:newfolder:ny mapp'); this._outputList(this.options.list); dialog = this; new InlineEditor($("foldername_newfolder"), {saveOnBlur: true, onSave: function(value) { $A($$("div#dialogContainer input")).each(function(input) { $(input).disable(); }); new Ajax.Request(dialog.newFolderOptions.url, { method: dialog.newFolderOptions.method, parameters: dialog.newFolderOptions.parameters + "&parentID=" + dialog.currentID + '&value=' + value, onLoading: function(transport) { $("dialogContainer").setStyle({cursor: "wait"}); }, onComplete: function(transport) { if (transport.status == 200) { if (transport.responseXML) { dialog.xmlDoc = transport.responseXML.documentElement; dialog.list.clear(); dialog._fillList(); dialog._outputList(dialog.options.list); $A($$("div#dialogContainer input")).each(function(input) { $(input).enable(); }); $("dialogName").focus(); $("dialogContainer").setStyle({cursor: "auto"}); } else { dialog._fillList(); dialog._outputList(dialog.options.list); $A($$("div#dialogContainer input")).each(function(input) { $(input).enable(); }); $("dialogName").focus(); $("dialogContainer").setStyle({cursor: "auto"}); } } }}); }}); }, // Eventfunktion för klick på #dialogImgDeleteFolder eller #dialogImgDeleteFile _onDelete: function(event) { if (this.selected) { element = Event.element(event); switch (element.id) { case "dialogImgDeleteFolder": if (this.selected.id.startsWith('folder')) { $(this.selected.id).ancestors()[0].remove(); this._showFolders("parentID=" + this.currentID + "&type_to_remove=folder&folderID=" + this.selected.id.slice(11)); } break; case "dialogImgDeleteFile": if (this.selected.id.startsWith('file')) { $(this.selected.id).ancestors()[0].remove(); this._showFolders("parentID=" + this.currentID + "&type_to_remove=file&fileID=" + this.selected.id.slice(9)); } break; } } }, // Eventfunktion för klick på #dialogImgGoBack _onGoBack: function(event) { this._showFolders("parentID=" + this.parentID); }, // Eventfunktion för klick på span _onSpanClick: function(event) { element = Event.element(event); if (this.selected && $(this.selected.id)) { if (this.selected.id == element.id && $(this.selected.id).ancestors()[0].hasClassName('selected')) { $(this.selected.id).ancestors()[0].removeClassName('selected'); this.selected = null; } else { $(this.selected.id).ancestors()[0].removeClassName('selected'); $(element).ancestors()[0].addClassName('selected'); this.selected = element; } } else { $(element).ancestors()[0].addClassName('selected'); this.selected = element; } }, // Eventfunktion för klick på mapp onFolderClick: function(event) { this.elements.folder = Event.element(event); this.options.onFolderClick(this.elements.folder); this.currentID = this._getParentID(this.elements.folder.id); this._showFolders("parentID=" + this.currentID); }, // Eventfunktion för klick på artikel onFileClick: function(event) { this.elements.file = Event.element(event); this.options.onFileClick(this.elements.file); $("dialogName").value = this.elements.file.innerHTML; if (confirm("Vill du skriva över filen?")) { return this.onSave(); } else { $("dialogName").focus(); return false; } }, // Eventfunktion för lämnande av dialogName-fältet onUnfocus: function(event) { this.name = $("dialogName").value; }, // Eventfunktion för klick på spara-knapp onSave: function() { //if ($("dialogName").value.blank()) { if (this.name.blank()) { $("dialogName").focus(); return false; } else { var overwrite = false; if (this._nameExists()) { if (confirm("Det finns redan en fil med namnet " + name + ".\nVill du verkligen skriva över denna?")) { overwrite = true; } else { overwrite = false; } } if (overwrite == false) { var params; params = this.options.onSave(this.name, this.currentID); if (!params) params = this.saveContentsOptions.parameters + "&name=" + this.name + "¤tID=" + this.currentID; var dialog = this; new Ajax.Request(this.saveContentsOptions.url, { method: this.saveContentsOptions.method, parameters: params, onLoading: function(transport) { $("dialogContainer").setStyle({cursor: "wait" }); }, onComplete: function(transport) { if (transport.status == 200) { $("dialogContainer").setStyle({cursor: "auto"}); $("dialogContainer").remove(); alert(transport.responseText); } else { alert(transport.statusText); } }}); } else { $("dialogName").focus(); return false; } } }, // Eventfunktion för klick på avbryt-knapp onCancel: function() { this.options.onCancel(); $("dialogContainer").remove(); } }); |
||
Svara med citat |
2008-11-14, 14:40 | #2 | ||
|
|||
Nykomling
|
saveDialog är odefinierad eftersom IE tycker sig hitta ett eller flera syntaxfel.
Jag orkar inte läsa igenom all koden - men ofta när IE krånglar när du kör prototype beror det på att något element inte extendats trots att prototypes dokumentation säger att så ska vara fallet. Ofta i samband med att du begär listor med element. Exempelvis är elementen som returneras av $('minDiv').select('.någonKlass') extendade i alla browsers utom IE. Använder du då någon av prototypes element-funktioner kommer IE att släcka ner. Jag ser inte ett enda try..catch i din kod - koda med ordentlig exception-hantering så går sånt här mycket lättare! |
||
Svara med citat |
Svara |
|
|