JavaScript

Hallo zusammen, ich muss zuerst gestehen, mit JavaScript kenne ich mich nicht wirklich aus. Ich verwende Uploadify um Dateien hochzuladen. Dazu zeige ich in einem HTML Select Form alle offnen Bestellungen an. Der Kunde wählt seine Bestellnummer aus und über selectOnChange() wird der Uploadbutton erstellt: [code]

Keine Bestellung ausgewählt...
[/code] Link zur Seite: [url=http://testshop.ottscho.de/shopware.php/sViewport,OrderUpload/sAction,account/userid,2]http://testshop.ottscho.de/shopware.php ... t/userid,2[/url] Nun habe ich das Problem, dass wenn man mehrere Bestellnummern nacheinander auswählt, mehrer Uploadbutton erstellt werden. Das würde ich gerne unterbinden. Leider habe ich keine Ahnung wie ich das machen soll. In der Theorie muss bei erneuten selectOnChange() nicht der Button an den Inhalt der DIV id="fileUpload" angehängt werden, sondern überschrieben werden. Ich freue mich über jeden Tipp von euch. Danke

Ich bin ehrlich gesagt nicht ganz dahinter gekommen, was du damit vorhast, aber die Vermutung wäre erstmal, dass das Problem darin besteht, dass der vorherige Button nicht gelöscht wird. Dieser Mix aus JS und jQuery ist eher ungewöhnlich, ich würde das wie folgt vereinfachen. Ich habe es nicht getestet - aber unbind() wäre erstmal mein Ansatz, den “Vorgänger” zu löschen. Kann sein, dass das so nicht läuft, da du kein Event attached hast. jQuery('#bestellung').change(function(){ var selectValue = jQuery(this).val(); jQuery("#fileUpload").unbind(); jQuery("#fileUpload").fileUpload({ 'uploader': '/engine/Shopware/Plugins/Community/Frontend/OrderUpload/Views/frontend/plugins/OrderUpload/\_resources/uploadify/uploader.swf', 'cancelImg': '/engine/Shopware/Plugins/Community/Frontend/OrderUpload/Views/frontend/plugins/OrderUpload/\_resources/uploadify/cancel.png', 'script': 'http://testshop.ottscho.de/shopware.php/sViewport,OrderUpload/sAction,upload/ordernumber,' + selectValue, 'multi': false, 'displayData': 'speed', 'auto': true, 'fileExt': '\*.ai;\*.psd;\*.ps;\*.jpg;\*.tif;\*.pdf;\*.png;\*.zip;\*.rar', 'fileDesc': 'Supported Files', 'buttonText': 'Datei suchen...', 'onAllComplete' : jQuery('#successful').show(); } }); }

Hey ShopFreelancer, ich habe es mal mit deinem Code versucht. Leider ohne Erfolg. Es wurde auch kein Button mehr erstellt bzw. angezeigt. So wie es aussieht, wird das JavaScript nicht ausgelöst, bei onChange… Dann habe ich es so versucht: <script type="text/javascript"> function selectOnChange() { var selectValue = document.getElementById("bestellung").value; $("#fileUpload").unbind(); $("#fileUpload").fileUpload({ 'uploader': '/engine/Shopware/Plugins/Community/Frontend/OrderUpload/Views/frontend/plugins/OrderUpload/_resources/uploadify/uploader.swf', 'cancelImg': '/engine/Shopware/Plugins/Community/Frontend/OrderUpload/Views/frontend/plugins/OrderUpload/_resources/uploadify/cancel.png', 'script': 'http://testshop.ottscho.de/shopware.php/sViewport,OrderUpload/sAction,upload/ordernumber,' + selectValue, 'multi': false, 'displayData': 'speed', 'auto': true, 'fileExt': '*.ai;*.psd;*.ps;*.jpg;*.tif;*.pdf;*.png;*.zip;*.rar', 'fileDesc': 'Supported Files', 'buttonText': 'Datei suchen...', 'onAllComplete' : function(event,data) { document.getElementById('successful').style.display='block'; } }); } </script> Jetzt habe ich aber wieder mehrere Buttons untereinander…

[quote=“ottscho”]Hallo zusammen, ich muss zuerst gestehen, mit JavaScript kenne ich mich nicht wirklich aus. Ich verwende Uploadify um Dateien hochzuladen. Dazu zeige ich in einem HTML Select Form alle offnen Bestellungen an. Der Kunde wählt seine Bestellnummer aus und über selectOnChange() wird der Uploadbutton erstellt: [code]

Keine Bestellung ausgewählt...
[/code] Link zur Seite: [url=http://testshop.ottscho.de/shopware.php/sViewport,OrderUpload/sAction,account/userid,2]http://testshop.ottscho.de/shopware.php ... t/userid,2[/url] Nun habe ich das Problem, dass wenn man mehrere Bestellnummern nacheinander auswählt, mehrer Uploadbutton erstellt werden. Das würde ich gerne unterbinden. Leider habe ich keine Ahnung wie ich das machen soll. In der Theorie muss bei erneuten selectOnChange() nicht der Button an den Inhalt der DIV id="fileUpload" angehängt werden, sondern überschrieben werden. Ich freue mich über jeden Tipp von euch. Danke[/quote] Zunächst mal: Kunden alle offenen Bestellungen zu zeigen, würde ich nicht machen, sondern natürlich nur die des Kunden.... Erweitere "selectOnChange()" wie folgt: [code]function selectOnChange() { var selectValue = document.getElementById("bestellung").value; $('#fileUploadUploader').remove(); //\<=======[/code]um einen schon existierenden Button zu löschen. Du lädst auch jQuery 2 Mal.... [url=http://www.pic-upload.de/view-9283580/jq.gif.html][img]http://www8.pic-upload.de/19.03.11/2k9jl4mma1c.gif[/img][/url]

Hey avenger, danke für deine Hilfe :wink: Ich zeige natürlich nur die offenen Bestellung des eingeloggten Kunden, nicht alle. Das wäre ja fatal. Leider geht es auch nicht! Mit remove wird die ganze DIV einfach aus dem Code entfernt. Der Flashcode wird ja nach dem DIV fielUpload eingefügt.

[quote=“ottscho”]Leider geht es auch nicht! Mit remove wird die ganze DIV einfach aus dem Code entfernt. Der Flashcode wird ja nach dem DIV fielUpload eingefügt.[/quote] Das muss gehen… Durch den “change” wir jedesmal ein "<embed id=“fileUploadUploader” … eingef wen ich ein vorhandenes l kann die div ja nicht verschwinden.>

Keine Bestellung ausgewählt...
[/code]

Ich nehm es zurück. Ich hatte einen Schreibfehler :wink: Ich hatte fileUpload statt fileUploadUploader in dem remove Code. Dann wurde die DIV mit der id fileUpload entfernt und nicht das Flash mit der id fileUploadUploade. Ich danke dir, nun geht es.

[quote=„ottscho“]Ich nehm es zurück. Ich hatte einen Schreibfehler :wink: Ich hatte fileUpload statt fileUploadUploader in dem remove Code. Dann wurde die DIV mit der id fileUpload entfernt und nicht das Flash mit der id fileUploadUploade. Ich danke dir, nun geht es.[/quote] Wenn Papa Avenger was schreibt sollte man das auch so verwenden… :sunglasses:

Ja Papa, ich dachte den Code kopiere ich nicht, die Zeile bekomme ich noch von Hand geschrieben! Dem war nicht so… :wink:

Nabend Papa, jetzt bräuchte ich noch mal bitte dein JavaScript-Wissen :wink: Der Button wird ja nun removed, so dass bei einem zweiten Upload nun alles klappt. Leider erhalte ich nun beim Hochladen einen zweiten Process Balken. Siehe Screen: Hast du eine Ahnung, wie ich das in Griff bekomme? Danke dir.

[quote=“ottscho”]Hast du eine Ahnung, wie ich das in Griff bekomme?[/quote] Sicher dat! “$(’#fileUploadQueue’).html(’’);” nach dem “.remove()” sollte das leisten… Schöne Lösung übrigens…

[quote=“avenger”] Schöne Lösung übrigens…[/quote] Danke :wink: Dein Vorschlag funktioniert leider nicht. Habe immer noch 2 Prozess-Fenster… Hast du noch weitere Ideen?

[quote=„ottscho“]Dein Vorschlag funktioniert leider nicht. Habe immer noch 2 Prozess-Fenster… Hast du noch weitere Ideen?[/quote] Poste mal Deinen aktuellen Code… Ist der online?

Der Code ist auf meinem Testsystem online: http://testshop.ottscho.de/shopware.php … t/userid,1 Falls du noch was anderes benötigst, einfach melden.

[quote=“ottscho”]Der Code ist auf meinem Testsystem online: http://testshop.ottscho.de/shopware.php … t/userid,1 Falls du noch was anderes benötigst, einfach melden.[/quote] Das Problem ist wohl, dass Uploadify diese Queue selbst verwaltet, und das Löschen daher nix bringt… http://www.uploadify.com/documentation/ … sizelimit/ Setze den Parameter mal auf 1 Und folgenden Code: ('#fileUploadUploader').remove(); (’#successful’).hide(); Mehr fällt mir dann nicht mehr ein…

Vielen Danke für deine Bemühungen. Hat leider auch nicht geholfen.

Hey avenger, in der JS Datei kann man das nicht ändern, oder? Nur in der Flash? Und diese ist ja geschlossen, so dass man nichts machen kann? jquery.uploadify.js [code] /* Uploadify v1.6.2 Copyright © 2009 by Ronnie Garcia Co-developed by Travis Nickels This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. You should have received a copy of the GNU General Public License along with this program. If not, see http:</http:>. */ var flashVer = -1; if (navigator.plugins != null && navigator.plugins.length > 0) { if (navigator.plugins[„Shockwave Flash 2.0“] || navigator.plugins[„Shockwave Flash“]) { var swVer2 = navigator.plugins[„Shockwave Flash 2.0“] ? " 2.0" : „“; var flashDescription = navigator.plugins[„Shockwave Flash“ + swVer2].description; var descArray = flashDescription.split(" „); var tempArrayMajor = descArray[2].split(“."); var versionMajor = tempArrayMajor[0]; var versionMinor = tempArrayMajor[1]; var versionRevision = descArray[3]; if (versionRevision == „“) { versionRevision = descArray[4] } if (versionRevision[0] == „d“) { versionRevision = versionRevision.substring(1) } else { if (versionRevision[0] == „r“) { ersionRevision = versionRevision.substring(1); if (versionRevision.indexOf(„d“) > 0) { versionRevision = versionRevision.substring(0, versionRevision.indexOf(„d“)) } } } var flashVer = versionMajor + „.“ + versionMinor + „.“ + versionRevision } } else { if ($.browser.msie) { var version; var axo; var e; try { axo = new ActiveXObject(„ShockwaveFlash.ShockwaveFlash.7“); version = axo.GetVariable("$version") } catch (e) {} flashVer = version.replace(„WIN „, „“).replace(“,“, „.“) } } flashVer = flashVer.split(".")[0]; if (jQuery) { (function (a) { a.extend(a.fn, { fileUpload: function (b) { if (flashVer >= 9) { a(this).each(function () { settings = a.extend({ uploader: „uploader.swf“, script: „uploader.php“, folder: „“, height: 30, width: 110, cancelImg: „cancel.png“, wmode: „opaque“, scriptAccess: „sameDomain“, fileDataName: „Filedata“, displayData: „percentage“, onInit: function () {}, onSelect: function () {}, onCheck: function () {}, onCancel: function () {}, onError: function () {}, onProgress: function () {}, onComplete: function () {} }, b); var d = location.pathname; d = d.split("/"); d.pop(); d = d.join("/") + „/“; var f = „&pagepath=“ + d; if (settings.buttonImg) { f += „&buttonImg=“ + escape(settings.buttonImg) } if (settings.buttonText) { f += „&buttonText=“ + escape(settings.buttonText) } if (settings.rollover) { f += „&rollover=true“ } f += „&script=“ + settings.script; f += „&folder=“ + escape(settings.folder); if (settings.scriptData) { var g = „“; for (var c in settings.scriptData) { g += „&“ + c + „=“ + settings.scriptData[c] } f += „&scriptData=“ + escape(g) } f += „&btnWidth=“ + settings.width; f += „&btnHeight=“ + settings.height; f += „&wmode=“ + settings.wmode; if (settings.hideButton) { f += „&hideButton=true“ } if (settings.fileDesc) { f += „&fileDesc=“ + settings.fileDesc + „&fileExt=“ + settings.fileExt } if (settings.multi) { f += „&multi=true“ } if (settings.auto) { f += „&auto=true“ } if (settings.sizeLimit) { f += „&sizeLimit=“ + settings.sizeLimit } if (settings.simUploadLimit) { f += „&simUploadLimit=“ + settings.simUploadLimit } if (settings.checkScript) { f += „&checkScript=“ + settings.checkScript } if (settings.fileDataName) { f += „&fileDataName=“ + settings.fileDataName } if (a.browser.msie) { flashElement = ’

' } else { flashElement = '' } if (settings.onInit() !== false) { a(this).css("display", "none"); if (a.browser.msie) { a(this).after('

‚); document.getElementById(a(this).attr(„id“) + „Uploader“).outerHTML = flashElement } else { a(this).after(flashElement) } a("#" + a(this).attr(„id“) + „Uploader“).after(‘

‚) } a(this).bind(„rfuSelect“, { action: settings.onSelect }, function (j, h, i) { if (j.data.action(j, h, i) !== false) { var k = Math.round(i.size / 1024 * 100) * 0.01; var l = „KB“; if (k > 1000) { k = Math.round(k * 0.001 * 100) * 0.01; l = „MB“ } var m = k.toString().split("."); if (m.length > 1) { k = m[0] + „.“ + m[1].substr(0, 2) } else { k = m[0] } if (i.name.length > 20) { fileName = i.name.substr(0, 20) + „…“ } else { fileName = i.name } a("#" + a(this).attr(„id“) + „Queue“).append(‘

[!(’ + settings.cancelImg + ‚)](javascript:$(‘#’ + a(this).attr()
’ + fileName + " (" + k + l + ') 

‚) } }); if (typeof(settings.onSelectOnce) == „function“) { a(this).bind(„rfuSelectOnce“, settings.onSelectOnce) } a(this).bind(„rfuCheckExist“, { action: settings.onCheck }, function (m, l, j, k, o) { var i = new Object(); i.folder = d + k; for (var h in j) { i[h] = j[h]; if (o) { var n = h } } a.post(l, i, function ® { for (var p in r) { if (m.data.action(m, l, j, k, o) !== false) { var q = confirm(„Do you want to replace the file '“ + r[p] + "‘?"); if (!q) { document.getElementById(a(m.target).attr(„id“) + „Uploader“).cancelFileUpload§ } } } if (o) { document.getElementById(a(m.target).attr(„id“) + „Uploader“).startFileUpload(n, true) } else { document.getElementById(a(m.target).attr(„id“) + „Uploader“).startFileUpload(null, true) } }, „json“) }); a(this).bind(„rfuCancel“, { action: settings.onCancel }, function (j, h, i, k) { if (j.data.action(j, h, i, k) !== false) { a("#" + a(this).attr(„id“) + h).fadeOut(250, function () { a("#" + a(this).attr(„id“) + h).remove() }) } }); a(this).bind(„rfuClearQueue“, { action: settings.onClearQueue }, function () { if (event.data.action() !== false) { a("#" + a(this).attr(„id“) + „Queue“).contents().fadeOut(250, function () { a("#" + a(this).attr(„id“) + „Queue“).empty() }) } }); a(this).bind(„rfuError“, { action: settings.onError }, function (k, h, j, i) { if (k.data.action(k, h, j, i) !== false) { a("#" + a(this).attr(„id“) + h + " .fileName").text(i.type + " Error - " + j.name); a("#" + a(this).attr(„id“) + h).css({ border: „3px solid #FBCBBC“, „background-color“: „#FDE5DD“ }) } }); a(this).bind(„rfuProgress“, { action: settings.onProgress, toDisplay: settings.displayData }, function (j, h, i, k) { if (j.data.action(j, h, i, k) !== false) { a("#" + a(this).attr(„id“) + h + „ProgressBar“).css(„width“, k.percentage + „%“); if (j.data.toDisplay == „percentage“) { displayData = " - " + k.percentage + „%“ } if (j.data.toDisplay == „speed“) { displayData = " - " + k.speed + „KB/s“ } if (j.data.toDisplay == null) { displayData = " " } a("#" + a(this).attr(„id“) + h + " .percentage").text(displayData) } }); a(this).bind(„rfuComplete“, { action: settings.onComplete }, function (k, h, j, i, l) { if (k.data.action(k, h, j, unescape(i), l) !== false) { a("#" + a(this).attr(„id“) + h).fadeOut(250, function () { a("#" + a(this).attr(„id“) + h).remove() }); a("#" + a(this).attr(„id“) + h + " .percentage").text(" - Completed") } }); if (typeof(settings.onAllComplete) == „function“) { a(this).bind(„rfuAllComplete“, settings.onAllComplete) } }) } }, fileUploadSettings: function (b, c) { a(this).each(function () { document.getElementById(a(this).attr(„id“) + „Uploader“).updateSettings(b, c) }) }, fileUploadStart: function (b) { a(this).each(function () { document.getElementById(a(this).attr(„id“) + „Uploader“).startFileUpload(b, false) }) }, fileUploadCancel: function (b) { a(this).each(function () { document.getElementById(a(this).attr(„id“) + „Uploader“).cancelFileUpload(b) }) }, fileUploadClearQueue: function () { a(this).each(function () { document.getElementById(a(this).attr(„id“) + „Uploader“).clearFileUploadQueue() }) } }) })(jQuery) }; [/code]

Ich hab diese Zeile entdeckt: [code] a("#" + a(this).attr(“id”) + “Queue”).append(’

[!(’ + settings.cancelImg + ‘)](javascript:$(’#’ + a(this).attr()
’ + fileName + " (" + k + l + ') 

') }[/code] Hier wird doch mit .append die Queue angehänt. Ich habe es mit innerHTML versucht, leider ohne Erfolg. Wenn hier statt anhängen - überschrieben wird, sollte es ja gehen.

Yesss… habs hinbekommen. Habe den Code raus genommen und die Div fest in die Template Datei geschrieben: [code] /*a("#" + a(this).attr(„id“) + „Uploader“).after(’

‚)*/ [/code] Und in der Java Datei mache ich den DIV noch leer: [code] a("#" + a(this).attr(„id“) + „Queue“).html(""); a("#" + a(this).attr(„id“) + „Queue“).append(‘

[!(’ + settings.cancelImg + ‚)](javascript:$(‘#’ + a(this).attr()
’ + fileName + " (" + k + l + ') 

') [/code]