﻿<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Mark van Aalst &#187; item editor</title>
	<atom:link href="http://www.markvanaalst.net/tag/item-editor/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.markvanaalst.net</link>
	<description>blogging about ASP.Net and web development related techniques</description>
	<lastBuildDate>Thu, 18 Feb 2010 18:12:20 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Creating a Item Editor</title>
		<link>http://www.markvanaalst.net/2009/08/19/creating-a-item-editor/</link>
		<comments>http://www.markvanaalst.net/2009/08/19/creating-a-item-editor/#comments</comments>
		<pubDate>Wed, 19 Aug 2009 11:55:03 +0000</pubDate>
		<dc:creator>Mark</dc:creator>
				<category><![CDATA[Sitecore]]></category>
		<category><![CDATA[item editor]]></category>
		<category><![CDATA[User Interface]]></category>

		<guid isPermaLink="false">http://www.markvanaalst.net/?p=22</guid>
		<description><![CDATA[For a blog module that I am developing I wanted to create an custom item editor. As you might know those are the &#8220;tabs&#8221; in the Content Editor. 1. Create a aspx file for the item editor user interface. 2. Select the core database in the desktop mode 3. Open the Content Editor and go to [...]]]></description>
			<content:encoded><![CDATA[<p>For a blog module that I am developing I wanted to create an custom item editor. As you might know those are the &#8220;tabs&#8221; in the Content Editor.</p>
<p>1. Create a aspx file for the item editor user interface.<br />
2. Select the core database in the desktop mode<br />
3. Open the Content Editor and go to the following path /Sitecore/Content/Applications/Content Editor/Editors/Items.<br />
4. You can create an item editor using the /Sitecore Client/Content Editor/Editor data template.<br />
5. You can give your item editor a name using the header field in the data section.<br />
6. In the icon field you can enter a path to the icon.<br />
7. In the url field you need to fill in the url to the aspx file created in step 1<br />
8. Save the item.<br />
9. Switch back to the master database.</p>
<p><span id="more-22"></span></p>
<p>Now we have created the item and the user-interface for the Item Editor. The next step is to assign the item editor to a template.</p>
<p>10. You can do this by setting it on the standard values or a individual item. Open the item in the content editor or template manager.<br />
11 . Click on the configure tab, go to the appearance group and click the editor command. A dialog will appear.<br />
12. In this dialog you can select the item editor you want to use, using the arrows you can sort.<br />
13. Finally close the dialog and save and publish.</p>
<p>Now when you select a item based on this template you see a item editor in the content editor with the title you filled in. You can edit the item editor using normal ASP.Net controls. This is a great solution for creating custom reports. But when you want to create an real custom editor functionality, you would like to use the default save button of the content editor. I might be confusing for a end-user to have two save button in one screen.</p>
<p>Unfortunately, Sitecore provides no default solution for capturing that event. Thanks to Eugene Omelnitsky from <a href="http://support.sitecore.net" target="_blank">Sitecore Support</a> (for pointing me in the right direction) I found a solution. You can adapt to the Save event using javascript. I then used <a title="JQuery" href="http://www.jquery.com" target="_blank">JQuery</a> to do an ajax call to the server and execute my save method.</p>
<p>This is the Javascript function which captures the save event and triggers an ajax call to my page method.</p>
<pre class="brush: jscript">
&lt;script type=&quot;text/javascript&quot;&gt;
function scGetFrameValue(value, request)
{
if (request.parameters == &quot;contenteditor:save&quot; || request.parameters == &quot;item:save&quot;)
{
$.ajax({
type: &quot;POST&quot;,
url: &quot;EntryEditor.aspx/SaveItem&quot;,
data: &quot;{ e: &#039;&quot; + $(&#039;#EditorIntroduction&#039;).val() + &quot;&#039;, title: &#039;&quot; + $(&#039;#tbTitle&#039;).val() + &quot;&#039;, content: &#039;&quot; + $(&#039;#EditorContent&#039;).val() + &quot;&#039; }&quot;,
contentType: &quot;application/json; charset=utf-8&quot;,
dataType: &quot;json&quot;,
success: function(msg) {
alert(&quot;succes!&quot;);
}
});
}
}
&lt;/script&gt;
</pre>
<p>And this is the method that I use server side</p>
<pre class="brush: csharp">
[System.Web.Services.WebMethod]
public static void SaveItem(string entryid, string introduction, string content, string title)
{
Database master = Factory.GetDatabase(&quot;master&quot;);

Item currentItem = ItemManager.GetItem(new ID(entryid), Sitecore.Context.Language, Sitecore.Data.Version.Latest, master);
Entry currentEntry = new Entry(currentItem);

currentEntry.BeginEdit();
currentEntry.Title = title;
currentEntry.Introduction = introduction;
currentEntry.Text = content;
currentEntry.EndEdit();
}
</pre>
<p>The code above is not perfect, it needs a bit more flexibility but for testing purposes it works.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.markvanaalst.net/2009/08/19/creating-a-item-editor/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>
