Making the Most of the Server Behavior Builder Part 1

 by Tom Muck

Manipulating the Selection

This is the first in a series of articles that expand on the material in Chapter 22 of DW UltraDev 4: The Complete Reference. The reader should be familiar with the creation of Server Behaviors.

The Server Behavior Builder in UltraDev is full of great features that make it easy to build your own custom Server Behaviors using complex ASP, JSP, or ColdFusion scripts, and even custom HTML and JavaScript. However, one limitation is that you can't effectively manipulate your selection within the confines of the SBB. There are many reasons why you might want to manipulate a selection. For example, you could take the selection and put it into a string for an email Server Behavior or you could replace sections of text with your own server-side code. We'll go through one technique that requires you to add a few lines of JavaScript hand-coding to your SBB-generated Server Behavior file.

If you've read the SB Controls content from the site, you might be wondering about the use of the HiddenField Server Behavior control. We'll use that control here to demonstrate "selection manipulation" within a SBB-generated Server Behavior.

UltraDev 1 had a completely different method for building Server Behaviors that involved the complex use of JavaScript with HTML to create a Server Behavior. UltraDev 4 added the XML structure to the existing Server Behavior API. Our book covers both methods in depth in Chapter 22. One thing that you can with the "old school" method of Server Behavior building is to manipulate the contents of the selected HTML and put it back into the document. A typical use might be to convert the selected region to a series of Response.Write statements in ASP.

For example, let's say you want to convert the following selection to a series of Response.Write statements:

<table>
  <tr>
    <td bgcolor="#FF6699">Hello</td>
    <td bgcolor="#FFFFFF"><img src="smiley.gif"></td>
  </tr>
</table>

When you are done, you want the code to look like this:

Response.Write("<table>") & vbcrlf
Response.Write("   <tr>") & vbcrlf
Response.Write("     <td bgcolor=""#FF6699"">Hello</td>") & vbcrlf
Response.Write("     <td bgcolor=""#FFFFFF""><img src=""smiley.gif""></td>") & vbcrlf
Response.Write("   </tr>") & vbcrlf
Response.Write("</table>") & vbcrlf

There are several changes that need to be made to the selection to make this transformation:

• Any double quotes in the selection need to be doubled up for VBScript.
• The line should begin with Response.Write("
• The line should end with ") & vbcrlf

How do we accomplish this and how do we put it into our Server Behavior?

First, we'll have to install the HiddenField Server Behavior Builder control. This is almost identical to the textfield control in functionality, but there is no visible control in the SB.

Next, we need to build the behavior. We'll include one block of code, which will be this:

<%
'Basic-Ultradev Manipulate Selection Sample
@@ourCode@@
%>

Simple. The Server Behavior should replace selection. This is a special weight that allows whatever code is in the code block to replace the current selection.

After clicking Next..., you can choose the Hidden Field as the Display As parameter. My Server Behavior Builder menu might look a little different from yours, as it has been modified:

As you can see, the selection is going to have to be manipulated by some JavaScript in order to be replaced by the parameter in the code block. We can do this in the applyServerBehavior function, right after the function begins. You can also choose to put the code into it's own function, and simply call it from applyServerBehavior.

First, grab the selection with the following lines:

var theDom = dw.getDocumentDOM();
var sel = theDom.getSelection();
var theSelection = theDom.documentElement.outerHTML.substring(sel[0], sel[1]);

For a full explanation of the code, see chapter 20 of our book or check out the Extending DW and UltraDev documents that come with UltraDev. After these three lines are executed, the variable theSelection contains the entire selection that the user has made. Next, we have to apply some manipulation to the code using regular expressions. Regular expressions are the key to understanding UltraDev extension writing, and allow you to perform powerful document manipulation.

theSelection = theSelection.replace(/\"/g,'""');

That line will replace all double-quotes in the selection with two double-quotes. Next, we'll have to add the Response.Write(" to the beginning of each line and the ") & vbcrlf to the end of each line. We'll do this in the following manner:

theSelection = theSelection.replace(/\r\n/g,'") & vbcrlf \r\n Response.Write("');

This line is replacing any existing line breaks with the closing quote character, the parenthesis, and the vbcrlf, followed by a new line and carriage return character, and then a Response.Write(". This effectively parses the entire string into a series of lines containing the Response.Write statements that we are after. One final bit of manipulation to place the Response.Write at the beginning of whole selection, and then putting the ending section on as well:

theSelection = 'Response.Write("' + theSelection + '") & vbcrlf';

Next, we'll place the newly manipulated selection into the hidden field, like this:

findObject("ourCode").value = theSelection;

That's all there is to it. The SB that is generated by the builder will take care of the rest for us, including putting the manipulated string back into the document. If you were to save the SB at this point and try it out, it should be able to take any type of HTML and place it into a series of Response.Write statements.

After placing the SB on the page, you may want to edit the SB at a later date. This will be the subject of the next part of the series.

Download the sample Server Behavior that follows this article.

Download the HiddenField SBB Control needed for the article.

tom
tommuck@basic-drumbeat.com