Web Forms for Marketers 8.0 Rev: September 13, 2018
Web Forms for Marketers 8.0
All the official Sitecore documentation.
Add an ASCX control to the page In the Web Forms for Marketers module, you can convert and export a form to an
.ascx file and then add it to your website as an ASCX control. For developers, this can make it easier to develop
their custom form control.
To add an ASCX control to the page:
1. Using a text editor, in the \layouts folder of your Sitecore installation, create a new default.aspx page and
insert the following code:
<%@ Page Language="C#" AutoEventWireup="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
</form>
</body>
</html>
....
```
Here's a sample JavaScript document extractor to extract the *name*, *type*, *website*, *description*, *abstract*, *author* , and *last_modified* attributes from this PDF:
```JavaScript
function extract(request, response) {
$ = response.body;
return [{
'name': $('div.page:eq(0)').text().trim().substring(0, 40) || 'No Name',
'type': 'pdf',
'website':'Sitecore Documentation',
'description' : $('div.page:eq(0)').text().trim().substring(0, 100) || 'No Description',
'author': $('meta[name="dc:creator"]').attr('content') || 'No Author',
'last_modified': $('meta[name="dcterms:created"]').attr('content') || 'No Last Modified Date'
}];
}
```
This function uses the following logic to get attribute values:
- `name` - trim text in the first `div` tag with the `class` of `page`. Then, use only the first 40 characters. If there is no text, set the value to *No Name*.
- `type` - use a fixed value, *pdf*.
- `website` - use a fixed value, *Sitecore Documentation*.
- `description` - use the text in the first `` tag of the class `page`, taking only the first 100 characters. If there is no text, set the value to *No Description*.
- `author` - use the content value of the first `meta` tag with the `name` of `dc:creator`. If there is no text, set the value to *No Author*.
- `last_modified` - use the text in the first `meta` tag with the `name` of `dcterms:created`. If there is no text, set the value to *No Last Modified Date*.
## Sample 2: Complex JavaScript extractor to get attribute values from PDF content
This example shows how to create a complex JavaScript extractor with many nested functions to get the attribute values you want. It also defines how to extract a `parent_url` attribute to track the parent page the PDF is on.
The PDF is available at *https://www.sitecore.com/customers/associations/us-masters-swimming*, by clicking **Download case study**. Here's what the HTML structure looks like, shortened for brevity:
```HTML
...
�
Industry: Associations • Founded: 1970 • Employees: 17
Headquarters: Boca Raton, Florida, USA • usms.org
....
Sitecore is the global leader in experience management software that combines content management, commerce,
and customer insights. The Sitecore® Experience Cloud™ empowers marketers
...
```
Here's a sample JavaScript document extractor to extract the *id*, *type*, *last_modified*, *name*, *description*, and *parent_url* attributes from this PDF:
```JavaScript
function extract(request, response) {
const translate_re = /&(nbsp|amp|quot|lt|gt);/g;
function decodeEntities(encodedString) {
return encodedString.replace(translate_re, function(match, entity) {
return translate[entity];
}).replace(/&#(\d+);/gi, function(match, numStr) {
const num = parseInt(numStr, 10);
return String.fromCharCode(num);
});
}
function sanitize(text) {
return text ? decodeEntities(String(text).trim()) : text;
}
$ = response.body;
url = request.url;
id = url.replace(/[.:/&?=%]/g, '_');
name = sanitize($('name').text());
description = $('body').text().substring(0, 7000);
$p = request.context.parent.response.body;
if (name.length <= 4 && $p) {
name = $p('name').text();
}
parentUrl = request.context.parent.request.url;
last_modified = request.context.parent.documents[0].data.last_modified;
return [{
'id': id,
'type': "pdf",
'parent_url': parentUrl
'last_modified': last_modified,
'name': name, //
'description': description,
}];
}
```
This function uses the following logic to get attribute values:
- `id` - replace special characters in the URL with an underscore (_).
- `type` - use a fixed value, *pdf*.
- `parent_url` - within the parent context (`request.context.parent`) access the `request` object. Then, access the `url` parameter.
- `last_modified` - within the parent context (`request.context.parent`) access the first documents array (`documents[0]`). Then, access the *data* object of the URL's *last_modified* attribute.
- `name` - use either the `name` HTML element or the parent document's `name` HTML element, as follows:
- First, sanitize the text of the `
` HTML element.
- Then, to check if the sanitized name is too short, see if the length is less than or equal to 4 characters.
- If the name is too short, AND the parent document has a defined body ($p), use the `name` tag from the parent.
- `description` - sanitize the text of the `` HTML element, limiting it to the first 7000 characters.