0

I am using a simple text editor from YUI, but when I click submit the code in the textarea/editor is not sent to the next page. I want to be able to receive it on the subsequent page and then store it in a DB(MySql). I have wasted lot of time already. Please help. HTML FILE:

<html>
<head>
<script type="text/javascript" src="http://yui.yahooapis.com/combo?2.9.0/build/yahoo-dom-event/yahoo-dom-event.js&2.9.0/build/container/container_core-min.js&2.9.0/build/element/element-min.js&2.9.0/build/editor/simpleeditor-min.js"></script>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.9.0/build/editor/assets/skins/sam/simpleeditor.css" />
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.2r1/build/assets/skins/sam/skin.css">
<!-- Utility Dependencies -->
<script src="http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js"></script> 
<script src="http://yui.yahooapis.com/2.8.2r1/build/element/element-min.js"></script> 
<!-- Needed for Menus, Buttons and Overlays used in the Toolbar -->
<script src="http://yui.yahooapis.com/2.8.2r1/build/container/container_core-min.js"></script>
<script src="http://yui.yahooapis.com/2.8.2r1/build/menu/menu-min.js"></script>
<script src="http://yui.yahooapis.com/2.8.2r1/build/button/button-min.js"></script>
<!-- Source file for Rich Text Editor-->
<script src="http://yui.yahooapis.com/2.8.2r1/build/editor/editor-min.js"></script>
<script>
YAHOO.util.Event.on('submit', 'click', function() {
myEditor.saveHTML(); 
var html = myEditor.get('element').value;
});
(function() { 
        var Dom = YAHOO.util.Dom, 
        Event = YAHOO.util.Event; 

        var myConfig = { 
                height: '200px', 
                width: '900px', 
                dompath: true,                   
            }; 
        myEditor = new YAHOO.widget.SimpleEditor('msgpost', myConfig); 
        myEditor.render(); 


})();       
</script>

</head>

<body class="yui-skin-sam">
<form action="submit.php" method="post">
    <textarea name="msgpost" id="msgpost" cols="50" rows="10"></textarea>
<input type="submit" value="Submit" onsubmit="return myDoSubmit()"/>
</form>
</body>
</html>
Aman Chhabra
  • 607
  • 1
  • 8
  • 21

2 Answers2

1

The saveHTML() method you used does not seem to save the value to the textarea element. And because the browser doesn't care about YUI Editor and just submits what is there already in the textarea (which is null), it submits the input as null..

You should set the value of the textarea to the editor value so the browser will submit that value instead of null.. Which can be achieved using this little line:

document.getElementsById("msgpost").value = html;

See this working JsFiddle I made for you.

However you had HTML syntax errors too. The onSubmit attribute should be on the form element not the submit button.

And listening to the event is not practical when you can simply call a function when the form submits.. (See the JsFiddle)

Miro Markaravanes
  • 3,285
  • 25
  • 32
  • Thanks a lot. I have to ask one more thing. I have a simple form with a button tag. Whenever I click button the form gets submitted, even though I have not asked for it.
    ... Please help me figure it out.. It is strange and I have restarted server but still.     – Aman Chhabra Jul 04 '13 at 15:00
  • When you set the button type to `Submit` it will submit the form ,which it's in it. You don't have to do any `Javascript` that is the default function of that button. If you don't want to automatically submit try the `Button` type. – Miro Markaravanes Jul 04 '13 at 15:33
  • That's the point.. here m using button(button tag) but still it is submitting. Am I doing something wrong?... Thanks – Aman Chhabra Jul 04 '13 at 16:45
0

I saw an example on this post.

Basically, add this to myConfig: handleSubmit: true

myConfig will then look like this:

var myConfig = { 
            height: '200px', 
            width: '900px', 
            dompath: true,
            handleSubmit: true  
        };
Community
  • 1
  • 1
Ryan
  • 911
  • 8
  • 7