[PHP / javascript] Zend_Dojo + tinyMCE in IE

[technocow]

Hoi,

Sinds kort ben ik bezig met het Zend framework en probeer een heel simpel formulier te maken met Dojo en tinyMCE.

Het formulier en tinyMCE renderen prima in de browser en zodra ik op de submit knop druk wordt alles verstuurd naar de server.

Tenminste in Firefox ... maar IE doet weer eens moeilijk

in IE wordt de inhoud van tinyMCE niet meegestuurd in de post. ($_POST['message'] is leeg)

In de head:

PHP:

<style type="text/css">
<!--
    @import "/js/dijit/themes/tundra/tundra.css";
-->
</style>

<script type="text/javascript" src="/js/dojo/dojo.js"></script>

<script type="text/javascript">
//<![CDATA[
dojo.require("dijit.form.Form");
    dojo.require("dojo.parser");
dojo.addOnLoad(function() {
    dojo.forEach(zendDijits, function(info) {
        var n = dojo.byId(info.id);
        if (null != n) {
            dojo.attr(n, dojo.mixin({ id: info.id }, info.params));
        }
    });
    dojo.parser.parse();
});
var zendDijits = [{"id":"formname","params":{"dojoType":"dijit.form.Form"}}];
//]]>

</script>

<script type="text/javascript" src="/js/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
    //<![CDATA[
tinyMCE.init({
            mode : "textareas",
            plugins : "emotions", 
            language : "nl"
            });
            //]]>
</script>

Formulier:

PHP:

<form id="formname" accept-charset="UTF-8" method="post" enctype="multipart/form-data" action=""><div>
<div class="formRow"><label for="name" class="required">Name</label>

<input type="text" name="name" id="name" value="" class="formtext"></div>
<div class="formRow"><label for="city" class="optional">City</label>

<input type="text" name="city" id="city" value="" class="formtext"></div>
<div class="formRow"><label for="email" class="optional">Email</label>

<input type="text" name="email" id="email" value="" class="formtext">
<div class="description">Will not be published</div></div>
<div class="formRow">
<textarea name="message" id="message" class="formtext" rows="24" cols="80"></textarea></div>
<div class="formRow">
<input type="submit" name="submit" id="submit" value="Submit" class="button"></div></div></form>

Als ik het dojo stuk uit de head haal werkt tinyMCE wel, maar dan werken mijn Dojo dingen uiteraard niet

Als ik het tinyMce stuk weghaal wordt de inhoud van de textarea wel meegestuurd maar heb ik geen fancy editor

[frickY]

Ik gok dat Dojo de window-onload handler van TinyMCE overruled.

De editor is niets anders dan een iframe waarvan de body bij het submitten in een hidden textarea wordt geplaatst. Dat lijkt bij jou niet te gebeuren.
Probeer die method zelf eens aan te roepen in het onsubmit-event van je formulier?

[technocow]

frickY schreef op woensdag 11 februari 2009 @ 18:56:
Ik gok dat Dojo de window-onload handler van TinyMCE overruled.

De editor is niets anders dan een iframe waarvan de body bij het submitten in een hidden textarea wordt geplaatst. Dat lijkt bij jou niet te gebeuren.
Probeer die method zelf eens aan te roepen in het onsubmit-event van je formulier?

hm.. ik zal het eens proberen met een losse knop.

het toevoegen van een onsubmit event aan dojo wil ook niet in IE

code:

dojo.connect(dijit.byId("formname"), "onSubmit", function(e){ alert("submit..."); } );

offtopic:
hoi pieter

edit:

ok, het is niet de window-onload maar de form-onsubmit

Als ik een button toevoeg met tinyMCE.triggerSave(); en daar eerst op klik voordat ik submit werkt het wel .. nu nog een manier vinden om dat even aan dojo toe te voegen, aangezien bovenstaande ook niet werkt in IE

edit:


IE doet helemaal niet aan onsubmit ?????

[ Voor 21% gewijzigd door technocow op 11-02-2009 19:51 ]

[frickY]

offtopic:
Pieter

IE doet inderdaad een beetje krom met een het submit-event. Als je via script een formulier wilt submitten zul je dat moeten doen met formelement.onsubmit(). In overige browsers kun je wel gewoon de submit() method aanroepen.

Loop anders even door de broncode van de triggerSave-method. Ik vermoed dat deze weinig anders doet dan submit-events binden aan je formulieren. Of kun je dat method niet in je window.onload (of document.domready) aanroepen?

[technocow]

offtopic:
er stond nog een post van Pieter maar die is weggehaald

Het is nu semi opgelost door

code:

dojo.addOnLoad(function () {
                    dojo.connect(dojo.byId(\'formname\'), \'onsubmit\', function () {
                        tinyMCE.triggerSave();
                    });
                 });

tussen script tags te plaatsen in de head. Alleen heb ik het idee dat er een mooiere oplossing moet zijn