Login / Register  search  syndication  about

          Ryan Farley's Blog

Ryan Farley on .NET Development with a focus on CRM Development for SalesLogix

Creating Sections for Controls on SalesLogix Web QuickForms

A common thing that any developer will do when creating a form for an application is to create sections for controls to group similar controls in a panel or other container, making it easy for the user to see that the values are related. There isn't exactly support for creating these "sections" in the SalesLogix Web QuickForms. With a quick bit of tweaks we can easily accomplish this result.

A new control was introduced in 7.2.2 in the Application Architect. This new control is called a "Control Container". This control is a non-visible container that is most commonly used to show or hide a group of controls at runtime on a QuickForm. If we look at what happens with this control when we build the web platform and deploy, we'll see that it ends up as an <asp:Panel>. Not only that, it actually has a CssClass attribute set. Cool. What this means is that we can create a style for this panel to give it a visual border by just adding the style to one of the SalesLogix style sheets. The style class used is "controlslist". This class is not currently defined in the 7.2.2 style sheets so we will add it ourselves in a bit.

To start, open your QuickForm in the Application Architect and add a Control Container to it. Add your controls to the container. What I like to do is also add a Horizontal Separator above the Control Container and set a Caption for the Horizontal Separator as well so it looks like a header for my section. My form in AA will look like the following:

 

I have my Horizontal Separator with a Caption of "Test Section" and a Control Container with 2 controls in it, a TextBox and a Button. Now, when I build and deploy the form, the Control Container will get created on the SmartPart as an <asp:Pane>, which at runtime will render as a <div>. Before deploying, we'll still need to add our style attributes to give this a visual look. In the Portal, go to the Support Files\CSS and open "SlxBase.css". Add to it the following:

.controlslist
{
    border: solid 1px #B5CBE0;
    padding: 5px; 
    margin: 7px;
}

Now we can deploy the site and the end result will look like this:

 
(With Horizontal Separator above the Control Container)

 
(Without the Horizontal Separator)

That is it. While that isn't quite as nice as using a FIELDSET or other section with a heading, I think that turned out plenty nice. If you need more flexibility than that for creating visible sections, you'd have to resort to building it as a custom SmartPart, instead of as a QuickForm. Another downside to this approach is that you've defined the border for all Control Containers. So, other Control Containers in the system will get this same look, whether you want it to have it or not.

Edit

I was thinking that it would be pretty easy to have this style and not have it apply to all Control Containers. A new property in 7.2.2 for most controls is one called StyleScheme. This property has been confusing for most since it has a drop-down and the only thing that appears in it is "NegativeNumber". However, you *can* just type in a value there and the value will get rendered out as the CssClass. If the selected control already renders a CssClass value then yours will get add to it (like this CssClass="controlslist MyCustomStyleClass", so both will still apply. For our solution, we could add the style class to SlxBase.css for "ControlSection" instead of "controlslist". Then, for any Control Containers we want to have this look we could just enter "ControlSection" in the Control Container's StyleScheme property. Then only those with this StyleScheme will have the "bordered" look to it instead of all Control Containers.

What's This?
  
Bookmark and Share

About Ryan Farley

   Ryan Farley is the Director of Development for Customer FX and creator of slxdeveloper.com. He's been blogging regularly about SalesLogix since 2001 and believes in sharing with the community. He loves C#, Javascript, Python, web development, open source, and Linux. He also loves his hobby as an amateur filmmaker.

View the SalesLogix Mobile Seveloper Series
View the SalesLogix SData Developer Series
View the Git for the SalesLogix Developer series



Related Content
   Change the Appearance of a Saleslogix (Now Infor CRM) Read Only TextBox Web Control
In the Salelogix web client, a read only control has a css style applied to it to make the background app
Posted on Oct 24, 2014 by Kris Halsrud to Kris Halsrud's Blog
 
   Saleslogix (now Infor CRM) Web Client- Changing Label Appearances on Quick Forms
 I wrote previously about setting a label's appearance on a quick form using server side code.&n
Posted on Oct 02, 2014 by Kris Halsrud to Kris Halsrud's Blog
 
   Error Attempting to Save an Entity: "E_FAIL(0x80004005)" in the Infor CRM (Saleslogix) Web Client
We recently had a client that was running into an issue when attempting to create one particular entity i
Posted on Sep 30, 2014 by Kris Halsrud to Kris Halsrud's Blog
 
   Video: Demystifying Infor CRM (Saleslogix) Updates
Watch it now! If you missed yesterdays demo, "Demystifying Infor CRM (Saleslogix) Updates" ,
Posted on Sep 26, 2014 by Brianna Ojard to The Inbox
 
   Official Infor CRM Acquisition FAQ
What to expect now that Saleslogix is Infor CRM. Like many of you, it will take some time (probably a
Posted on Sep 18, 2014 by Brianna Ojard to The Inbox
 
Comments

 

Creating Sections for Controls on SalesLogix Web QuickForms said:

Pingback from  Creating Sections for Controls on SalesLogix Web QuickForms

April 23, 2008 2:27 PM
 

Mark Dykun said:

I use the StyleScheme often enough to give controls like labels a more profound look. I could imagine that you could link a custom stylesheet into base.master and then add any style classes that are outside the of the prepackaged ones.

Mark

April 23, 2008 6:55 PM
 

Ryan Farley said:

Hi Mark!

I think that is a good practice, and one that I use as well. It is an easy task to create your own style sheets and then add them into the master templates. You can even add them in below, or after, the base CSS style entries so you can provide overrides to base styles, without ever needing to touch the base OOTB files (which will make upgrades easier).

-Ryan

April 24, 2008 12:46 PM
 

Todd Hardin said:

Just stumbled onto this today (several years after it was created).

Great technique Ryan - thanks for all the great techniques and discussions you share with everyone!

June 30, 2012 4:08 PM

Leave a Comment

(required)  
(optional)
(required)  
Add
All contents Copyright © 2014 Customer FX Corporation
Customer FX Corporation
2324 University Avenue West, Suite 115
Saint Paul, Minnesota 55114
Tel: 800.728.5783

  Follow @CustomerFX on twitter
Follow the best news, tips, and articles
  Subscribe to Customer FX on youtube
Watch SalesLogix tutorial videos from Customer FX
Login / Register