UrlList Field Control

From Sense/Net Wiki
Jump to: navigation, search
  •  
  •  
  •  
  •  
  • 100%
  • 6.0
  • Enterprise
  • Community
  • Planned

Overview

UrlList Field Control is a Field Control that contains an editable list of URLs assigned to the Site in a table format.

UrlList Field Control

Details

UrlList Field Control renders the assigned URLs in a table. The first column contains the Site names that are the URLs assigned to the site, the second column contains the Authentication type settings for the given urls. The latter value can be Windows, Forms and None. New URLs can be added by clicking the +Add link. URLs can be deleted by clicking the 'X' button before each entry.

A specific URL can only be assigned to a single Site only. If an URL is already assigned to a Site and you want to assign the same URL to another Site as well, the portal will throw an error message on save.

Supported Field types

Properties

  • ControlPath: (optional) path of the control defining the layout of the Field Control in Edit mode.

For a complete list of common Field Control properties see common Field Control properties.

Templates

Edit view template

<%@  Language="C#" %>
<%@ Import Namespace="SenseNet.Portal.UI" %>
<%@ Import Namespace="SNControls=SenseNet.Portal.UI.Controls" %> 
 
<asp:TextBox ID="InnerData" runat="server" style="display:none" CssClass='<%# "sn-urllist-innerdata-" + UITools.GetFieldNameClass(Container) %>' />
<div class='<%# "sn-url-list-" + UITools.GetFieldNameClass(Container) %>'></div>
 
<sn:scriptrequest runat="server" path="$skin/scripts/sn/sn.urllist.js" />
<script>
    $(function () {
        var $urlList = $('<%# ".sn-urllist-innerdata-" + UITools.GetFieldNameClass(Container) %>');
        var $list = $('<%# ".sn-url-list-" + UITools.GetFieldNameClass(Container) %>');
        var urlList = $list.UrlList({
            data: $urlList.val(),
            textarea: $urlList,
            mode: 'edit'
        });
    })
</script>

Browse view template

<%@  Language="C#" EnableViewState="false" %> 
<%@ Import Namespace="SenseNet.Portal.UI" %>
<%@ Import Namespace="SNControls=SenseNet.Portal.UI.Controls" %> 
 
<asp:TextBox ID="InnerData" runat="server" style="display:none" CssClass='<%# "sn-urllist-innerdata-" + UITools.GetFieldNameClass(Container) %>' />
<div class='<%# "sn-url-list-" + UITools.GetFieldNameClass(Container) %>'></div>
 
<sn:scriptrequest runat="server" path="$skin/scripts/sn/sn.urllist.js" />
<script>
    $(function () {
 
        var $urlList = $('<%# ".sn-urllist-innerdata-" + UITools.GetFieldNameClass(Container) %>');
        var $list = $('<%# ".sn-url-list-" + UITools.GetFieldNameClass(Container) %>');
        var urlList = $list.UrlList({
            data: $urlList.val(),
            textarea: $urlList,
            mode: 'browse'
        });
    })
</script>

As you can see in the samples, there's a hidden TextBox to store the urls in JSON and the ui is built-up with a small jQuery plugin which process data from the TextBox and renders the list. This plugin is used in both rendering modes that can be set as the 'mode' parameter of the plugin. The UI of this FieldControlTemplate is based on kendoui's [MVVM] and [ListView] widget.

Example/Tutorials

Simple example

   <sn:UrlList ID="UrlList1" runat="server" FieldName="UrlList" />

Related links

References