adding image upload to a simple text editor
<p>i am implementing a very simple text editor using javascript and was wondering oon how i could add the capability of image upload(not through a link, but from the user's computer), it just basically involves setting an iframe to be content editable:</p>

<pre><code>&lt;iframe id="textEditor" style="width:500px; height:170px;" scrolling="no" &gt;

&lt;/iframe&gt;
</code></pre>

<p>the javascript:</p>

<pre><code>textEditor.document.designMode="on";
textEditor.document.open();
textEditor.document.write('&lt;head&gt;&lt;style type="text/css"&gt;body{ font-family:arial; font-  size:13px; }&lt;/style&gt; &lt;/head&gt;');
textEditor.document.close();
</code></pre>

<p>this function deals with setting color, font size, font type etc:</p>

<pre><code>  function fontEdit(x,y)
  {
  textEditor.document.execCommand(x,"",y);
  textEditor.focus();
  }
</code></pre>

<p>where the parameters are passed through various methods, basically lists(options):</p>

<pre><code> &lt;select id="color" onChange="fontEdit('ForeColor',this[this.selectedIndex].value)"&gt;
 &lt;option value="black"&gt;-&lt;/option&gt;
 &lt;option style="color:red;" value="red"&gt;-&lt;/option&gt;
 &lt;option style="color:blue;" value="blue"&gt;-&lt;/option&gt;
 &lt;option style="color:green;" value="green"&gt;-&lt;/option&gt;
&lt;option style="color:pink;" value="pink"&gt;-&lt;/option&gt;
&lt;/select&gt; 
</code></pre>

<p>and so on. I tried a few things, like using ajax to upload the image to the iframe, and adding a source file that echoed the image on upload, but that never worked (i later learnt that was very silly to try). So could anyone kindly explain to me, how i would add image uploading, from the user's computer and not through a link, to the iframe, or how to do this using a different approach?Thanks in advance.</p>
