From 8e192dbb785c26505cb4d0d9165fa5402683cedc Mon Sep 17 00:00:00 2001
From: "w.stoettinger" <wolfgang.stoettinger@gmail.com>
Date: Fri, 6 Nov 2015 17:53:23 +0100
Subject: [PATCH 1/2] Readme: Working with forms

Inserted an example on how to work with forms to keep the textarea
automatically up to date with SimpleMDE
---
 README.md | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index d1922e6..86b20e7 100644
--- a/README.md
+++ b/README.md
@@ -57,14 +57,31 @@ var simplemde = new SimpleMDE({ element: $("#MyID")[0] });
 
 ## Get/set the content
 
+Get the content
+
 ```JavaScript
-simplemde.value();
+var val = simplemde.value();
 ```
 
+Set the content
+
 ```JavaScript
 simplemde.value("This text will appear in the editor");
 ```
 
+## Working with forms
+
+By listening to the `blur` function of codemirror you can ensure, that the value of the underlying textarea in your form always corresponds to the value of your SimpleMDE and vice versa.
+
+```JavaScript
+var textarea = $("#MyID");
+var simplemde = new SimpleMDE({element: textarea[0]});
+simplemde.value(textarea.text());
+simplemde.codemirror.on("blur", function() {
+   textarea.text(simplemde.value());
+});
+```
+
 ## Configuration
 
 - **autoDownloadFontAwesome**: If set to `true`, force downloads Font Awesome (used for icons). If set to false, prevents downloading. Defaults to `undefined`, which will intelligently check whether Font Awesome has already been included, then download accordingly.

From 6129620534f11af4f095ebceac077b3e2cbdb6c0 Mon Sep 17 00:00:00 2001
From: "w.stoettinger" <wolfgang.stoettinger@gmail.com>
Date: Fri, 6 Nov 2015 18:57:12 +0100
Subject: [PATCH 2/2] Added example to restore default tab behaviour

---
 README.md | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/README.md b/README.md
index 86b20e7..e9fe7aa 100644
--- a/README.md
+++ b/README.md
@@ -71,6 +71,8 @@ simplemde.value("This text will appear in the editor");
 
 ## Working with forms
 
+### Setting the form value correctly before Submit
+
 By listening to the `blur` function of codemirror you can ensure, that the value of the underlying textarea in your form always corresponds to the value of your SimpleMDE and vice versa.
 
 ```JavaScript
@@ -82,6 +84,30 @@ simplemde.codemirror.on("blur", function() {
 });
 ```
 
+### Restoring default tab behaviour in forms
+
+Here is a way how you can restore the default tab behaviour within forms. Please note, that this prevents the possibility to input tabs into the text.
+
+```JavaScript
+var textarea = $("#MyID");
+var simplemde = new SimpleMDE({element: textarea[0]});
+var formKeyMap = {
+  "Ctrl-Enter": function () {
+    $(textarea).text(simplemde.value());
+    $('#submit').trigger('click'); // or $('#form').submit() depending on the server-side implementation
+  },
+  "Tab": function () {
+    var inputs = $(textarea).closest('form').find(':input');
+    inputs.eq( inputs.index(textarea)+ 2 ).focus(); // +1 would focus codemirrors own textarea element again, which is not what we want.
+  },
+  "Shift-Tab": function () {
+    var inputs = $(textarea).closest('form').find(':input');
+    inputs.eq( inputs.index(textarea)- 1 ).focus();
+  }
+};
+simplemde.codemirror.addKeyMap(formKeyMap);
+```
+
 ## Configuration
 
 - **autoDownloadFontAwesome**: If set to `true`, force downloads Font Awesome (used for icons). If set to false, prevents downloading. Defaults to `undefined`, which will intelligently check whether Font Awesome has already been included, then download accordingly.