Search the help documentation

Search:

Can't find what you are looking for? Use the Feedback tab in your app to submit an issue, or email support@ qrimp.com.


idnamedescriptionParentTopic
deleteedit157WorkflowWorkflow in a business software application controls how a user navigates the data in an application to complete business processes. It is a series of operations or tasks, done in a particular order.

Using Qrimp you can create custom workflows to control which pages are presented to a user and when.

The three main tools used to set up custom workflows with Qrimp are [Views], [Headers and Footers] and [Field Templates].

Pull data into your views, add [NextPrevious] arrows to your headers and footers, controlling the action on the buttons, and placing instructions and more in your field templates are a few ideas of how you can guide users through data entry processes.
Navigation
deleteedit158Paying with PayPalPaying for your Qrimp hosted application is easy. We use PayPal. If you have used PayPal before, it should be fairly straightforward. We've outlined the process below.

From the Qrimp <a href="http://www.qrimp.com/signup.html">sign-up page</a>, click the "Sign up" Button.

On the next screen, select the plan you would like and click the "Pay Now" button.

Sign in to your PayPal account or select "Pay with Credit Card" if you do not have one.

Billing
deleteedit159Cancelling PayPal SubscriptionsThe following is from the PayPal website and tells you how to cancel your Qrimp subscription. We added screenshots to make it easier.

A subscription can be canceled up to the day of the next scheduled payment.

1. Log in to your account
2. Click the My Account tab.
3. Click the History subtab.
4. Choose the Subscriptions field from the Show drop-down menu.
<img src="attachments/6bc9e2f3-5360-4f88-9125-cb1fe80414a0/ppsubscriptionsdropdown.JPG" />
5. Check the From box and change the date back to your subscription date.
6. Click Search, and then click Details.
<img src="attachments/52ba7245-98a1-4c5a-902d-c90b2d3dfa73/ppsubscriptionsdetailslink.jpg" />
7. Click Cancel Subscription.
<img src="attachments/56f00d36-c3fa-42cf-99c3-6db5efb4ebc0/cancel button.JPG" />
Billing
deleteedit160Time Zone AwarenessTime Zone Awareness allows you to set your system up so that each user sees the date and time information associated with their data in the correct time zone for their location.

If you are an existing Qrimp user, you will be asked to choose your time zone next time you log in. If not, you will be asked to chose a timezone at your first login.


My Account
deleteedit161Date FormatsSometimes you want to display dates in a particular format that suits the context. Maybe you only want to display the time or the day. You can do this with [square brackets] notation like so:

<textarea><span style='font-family:monospace;font-size:1.2em;'><strong></strong></span></textarea>

Where <strong><em>datevalue</em></strong> is any valid date including square bracket notation references to column names or the current system time <noeval>12/6/2024 9:16 AM</noeval> and <strong><em>validdateformat</em></strong> is a string built from the components below.

Examples:

<strong>MM/dd/yyyy hh:mm tt</strong> produces <noeval></noeval>

<strong>ddd, dd MMM yyy HH:mm:ss GMT zz</strong> produces <noeval> (this is the format for XML)</noeval>

<h4>Here are more options for date formats</h4> d - Short date
%d - Day number
M?d - Month and day number
dd - Day number, two digits
ddd - Abbreviated day name
dddd - Full day name
f - Full (long date, short time)
%f - Fractions of second, one digit
s^f - Seconds and fractions of second, one digit
ff - Fractions of second, two digits
fff - Fractions of second, three digits
ffff - Fractions of second, four digits
g - General
%g - Era (eg. A.D.)
y-g - Year and era (eg. 5-A.D.)
gg - Era (eg. A.D.)
h - Hour (1-12) (Doesn't seem to work)
%h - Hour (1-12)
h-m - Hour and minute
hh - Hour (01-12)
H - Hour (0-23) (Doesn't seem to work)
HH - Hour (00-23)
m - Month name and date
%m - Minute (0-59)
hh_m - Hour and minute (0-59)
mm - Minute (00-59)
M - Month name and date
%M - Month number (1-12)
M d - Month number and day number
MM - Month number (01-12)
MMM - Month abbreviation
MMMM - Month name
s - Standard sortable date/time
%s - Seconds (0-59)
s^ff - Seconds (0-59) and fraction of seconds
ss - Seconds (00-59)
t - Long time
%t - First letter of AM/PM designator
hh t - Hour and first letter of AM/PM designator
tt - AM/PM designator
y - Short date
%y - Year (0-99)
m-y - Month and year
yy - Year (00-99)
yyyy - Year (0000-9999)
z - Doesn't work
%z - Whole hour time zone (-12 to 13)
Zone:z - Zone - and whole hour time zone (-12 to 13)
zz - Whole hour time zone (-12 to 13) with two digits
zzz - Time zone in hours and minutes})
Square Brackets
deleteedit163Installing Qrimp on Windows VistaThe following instruction guide works with Windows Vista and Windows 7 Home Edition or better.

<h4>Installing Internet Information Services</h4>

When installing IIS on Windows Vista Home, <strong>be sure to include ASP.NET</strong> as in this more detailed installation guide:
<a href="http://learn.iis.net/page.aspx/28/installing-iis-70-on-windows-vista/">http://learn.iis.net/page.aspx/28/installing-iis-70-on-windows-vista/</a>

<h4>Installing SQL Server Express</h4>
For Microsoft Vista, you can install either the 2005 or 2008 editions of SQL Server Express.
<ul>
<li>To install SQL Server 2005 Express with Advanced Services SP2, including advanced tools such as the management studio, reporting services, and full-text search, from <a href="http://www.microsoft.com/express/2005/sql/download/default.aspx">http://www.microsoft.com/express/2005/sql/download/default.aspx</a>. It is the 234MB download file.</li>
<li>To install SQL Server 2008 Express with Advanced Services, you have two options:
<ul><li>Leverage a single installer to install SQL Server 2008 Express and all the prerequisites, use the following link:
<ul><li><a href="http://www.microsoft.com/express/sql/download/">http://www.microsoft.com/express/sql/download/</a></li></ul></li>
<li>Manually install SQL Server 2008 Express and all the prerequisites individually, use the following link:
<ul><li><a href="http://www.microsoft.com/downloads/details.aspx?FamilyID=b5d1b8c3-fda5-4508-b0d0-1311d670e336&DisplayLang=en">http://www.microsoft.com/downloads/details.aspx?FamilyID=b5d1b8c3-fda5-4508-b0d0-1311d670e336&DisplayLang=en</a></li>
<li>Note: Make sure that you follow the steps outlined in the <b>Instructions</b> section</li></ul></li>
</ul></ul>
Tips for installing the SQL Server:<ul><li>Include all the options when selecting what features to install</li><li>Use "Mixed Mode" for the security model</li><li>Rember the password created for the <b>sa</b> account because it will be used in the connection string in the web.config (see below).</li>
</ul>
Once SQL Server is installed, open the management studio. Log in as <b>sa</b> using the password you created. Create a new database called "intranet" with the default settings. The name you provided for the new database will be used in the connection string in the web.config (see below).

<h4>Installing Qrimp</h4>
You should have received an email with a personalized Qrimp downloadable zipfile with a password designed for only your use. Download that file and unzip the contents as follows.

Note, if you want to run qrimp from http://localhost instead of http://localhost/qrimp then you'll need to copy the contents of the qrimp folder to the wwwroot folder.

<strong>File Upload Security Settings</strong>

Add modify rights for the following directories:<ul><li>c:\inetpub\wwwroot\qrimp\attachments<li>c:\inetpub\wwwroot\qrimp\fileicons</ul>
to IIS_IUSRS group by right clicking on the folder in Windows explorer, choosing properties, clicking edit button, clicking ok to the permissions prompt, clicking IIS_IUSRS, click the checkbox by Modify in the list below.

<img src="https://developer.qrimp.com/attachments/55bf722b-d758-4f3f-932e-4e54df8e38cf/Vista1.png">

<h4>Install .NET 3.5</h4>
You can download the redistributable from <a href="http://www.microsoft.com/downloads/details.aspx?familyid=333325FD-AE52-4E35-B531-508D977D32A6&displaylang=en">http://www.microsoft.com/downloads/details.aspx?familyid=333325FD-AE52-4E35-B531-508D977D32A6&displaylang=en</a>

<h4>Reboot</h4>
A reboot here is necessary to let all the components come together. You may also want to use Windows Update to add any service packs that are necessary now.


<h4>Configuring IIS and Qrimp</h4>
From the Control Panel, under Computer Management > Services and Applications > Internet Information Services

Drill down to ComputerName > Web Sites > Default Web Site > qrimp

Right click choose Convert to Application

Either modify the web.config or the application settings > connectionstring to point to the intranet database created above. If you use notepad, you'll have to run notepad as Administrator to save the file.

<h4>Accessing Qrimp Locally</h4>
After all this is finished, type this into your browser:

<a href="http://localhost/qrimp">http://localhost/qrimp</a> (if you are using the default qrimp folder) or
<a href="http://localhost">http://localhost</a> (if you moved Qrimp to the root url, which we prefer)

Now you will step through a couple install screens. Qrimp will download the latest database configuration files from the Internet, create your database, and register the installation with us. After that you are good to go. You can synchronize with an application online by visiting http://localhost/qrimp/synchronize.aspx or http://localhost/synchronize.aspx and entering the details for another Qrimp application.

<h4>Potential Problems</h4>
<Strong>Directory browsing is not allowed</strong>
If you get an error that directory browsing is not allowed, then you probably forgot to add ASP.NET to the list of IIS technologies to install. See the first step above.

<strong>SQL Server Connection Problems</strong>
If you access the url and it redirects you to a page asking you to configure the database settings, but you have already configured them in the web.config, then your SQL Server instance may be configured to accept Windows Authentication only, see: <a href="http://support.microsoft.com/kb/555332">http://support.microsoft.com/kb/555332</a>

To enable mixed mode authentication, see this tutorial on the web:
<a href="http://www.hostmysite.com/support/vps/windows/mixedmode/">http://www.hostmysite.com/support/vps/windows/mixedmode/</a>

<strong>Blank Page Displayed</strong>
If you access Qrimp through the browser, but see a blank page, then there may be a problem with some of the security settings for IIS, which needs to write temporary files to the system.

You can test this by creating a test.aspx file in the wwwroot folder and trying to access it via http://localhost/test.aspx If you see an error indicating access is denied to c:\windows\temp or something like that, see this page for help enabling the correct security on that folder: <a href="http://geekswithblogs.net/ranganh/archive/2005/05/13/39582.aspx">http://geekswithblogs.net/ranganh/archive/2005/05/13/39582.aspx</a>
Working Offline, Backing Up, Getting Data out
deleteedit165Automated Backup ProcessIf you'd like to set up an automated process, here's how to do it.

Issue a form post to your application like this:
https://yourqrimpappurl/login.aspx
txtUsername= {your username}
txtPassword= {your password}
uid=true

You can also use a get, but then the logs show the query string in some server setups. Better to use a post.

Now, the response will contain a GUID representing the user who just logged in. Next, download a file from the following url using GET:
https://yourqrimpappurl/inserts.aspx?backup=true&download=true&uid={uid from above}

or more securely using FORM Post to:
https://yourqrimpappurl/inserts.aspx
backup=true
download=true

and then save the result to a local .zip file. By default, the filename will include the Qrimp app URL and the date and time in the file name, but you can save it as whatever filename you like.

Your file will be encrypted and zipped up and locked with a password to prevent tampering. If you ever need to restore your database to one of these points in time, then email [Qrimp Support] or [Open a Trouble Ticket] and we will restore your system. Additional fees may be required for certain hosted plans or download accounts.

Enterprise customers can backup their database to Amazon S3 in an automated fashion like this as well. Please contact [Qrimp Support] for more information about how to do this. We will soon be adding backup to Mosso CloudFS for databases smaller than 5 GB.

Also, remember, this does not copy the attachments, it only backs up the data. If you would like to copy attachments as well, use [Synchronizer] with automation.
Backing up your data
deleteedit166Automating SynchronizerIf you would like to automate the synchronization process to create a [redundant fail over system] for [disaster recovery], you will want to automate your Synchronizer on an hourly or daily interval.

Automating Synchronizer will allow you to create two systems that are identical up to the last synchronize -- including data and file attachments.

Because the synchronize process takes a bit of time itself, remote copies of applications are not identical and should not be considered identical. Using Synchronizer in this way is fine for remote sites that are all copies of a master. In this way, your system can be set up as a [Content Delivery Network] to serve users in remote locations on Qrimp nodes closer to them. You can also [Automate Qrimp Publisher] in this way to push static copies of your site to remote servers around the globe.

Imagine a scenario where your data management happens inside a firewall and you publish content to a CDN outside your firewall. You could first deploy your application from inside the firewall to a secure node in the cloud. Remote nodes around the world could be set to automatically synchronize from that remote node, then publish their contents using templates customized to the locale of the visitors hitting those nodes.

If you would like to configure Qrimp to deliver your information in this way, please contact [Qrimp Support].
Synchronizer
deleteedit167Help TopicsThe Qrimp Help Files will teach you what you need to know to build and maintain your Qrimp app.

If there is a topic missing, or something is unclear, please contact us to let us know.
Getting More Help
deleteedit168Forums<!--Qrimp forums let you talk with other Qrimp users. The forums are also frequented by Qrimp Support. We get email alerts when new topics are posted. The forums are a great way to capture knowledge for all Qrimp users.
<a href="https://developer.qrimp.com/db.aspx?t=1001&o=27">
Visit the Qrimp Forums</a>.

<img src="/attachments/037713fb-f4d1-4296-9f0e-c701304d22cb/QrimpForum.png">-->
The Qrimp forums are currently closed. If you are interested in a forum venue for discussing your app with other users, please email support to place your vote for re-opening the forum system.
Thank you.
Getting More Help
deleteedit169EmailEmail support is available for paying customers. We also offer email support to customers during any free trial periods. Email support at qrimp dot com.

For issues that we can't resolve via email, we can set up a [Webinar], or even log in to your account remotely, with your permission. Just contact us, we will work with you.
Getting More Help
deleteedit170WebinarIf you have a bug that cannot be resolved, or would like hands on tutoring, please <a href="https://developer.qrimp.com/db.aspx?t=1013&vid=8&selectedcategory=18">request a webinar using our trouble ticket system</a>, contact [Qrimp Support], or fill out our <a href="https://www.qrimp.com/services.html">information request form</a> and indicate some days and times that are good for you.

Webinars let us show you our screen while we move the mouse around so you can see how we do things. In a webinar, we can also browse to your web application and give you control of our browser so you can log in. We can then help you from directly within your system and you can see what we are doing right on your screen. A webinar is a great way to learn more about Qrimp and how to perform these tasks yourself later.
Getting More Help
deleteedit171Getting More HelpIf you were unable to find the information you needed in this help documentation, or if you were unable to use the instructions to accomplish your goals, please email support@qrimp.com and let us know what you are trying to do or what you had trouble with.

<h2>Contextual Help within your Qrimp App</h2>
If you click the help link in the top right hand corner of your browser, near the search box for your Qrimp app, you'll be brought to the Help Topics with relevant help topics listed for you about the area where you were when you clicked the link. For example, if your managing users and you need help, click the help link and you'll be taken to the developer help topics with Manage Users right at the top of the list.

If you had clicked the help link while managing a table and you want to know how to use [computed columns], you'd be shown the help topic on [table management]
deleteedit175CRUDIn every Qrimp app, there are five default [operations] that users can perform on a database: Create, Read, Update, Delete and Admin. To allow your users to perform these operations, give them the permission to do so using [Table Security].

You can create as many levels of access as you like. Add, remove, or adjust the configuration of existing operations to fine tune the capabilities your users have within your Qrimp Application.

Learn more about CRUD by searching the web.
Definitions
deleteedit176Views<nobreak>
Views are ways of displaying data on the page. Qrimp can display data in a table, a photo gallery, XML, or a large number of other layouts. Views are also used to let you edit data or rearrange it on a page. Advanced developers can also use views as page templates to add new layouts using <a href="db.aspx?t=HelpTopics&id=203&vid=11">HTML</a> and Qrimp's [square brackets] notation.

Qrimp also has [Custom Views (Sorting and Filtering)]

<h2>Basic Views</h2>
Frequently used views are linked to by default in the [Content Header] with the following icons:<br/>
[Calendar View]  <img align=absmiddle src="icons/crystal_project/32x32/apps/cal.png"><br/>
[Tree View]  <img align=absmiddle src="icons/crystal_project/32x32/actions/view_tree.png" alt="Tree View"/> <br/>
[Grid View]  <img align=absmiddle src="icons/crystal_project/32x32/actions/view_text.png" alt="Grid View"/> (Also called list view or table view).<br/>
[Grid Edit]  <img align=absmiddle src="icons/crystal_project/32x32/apps/kate.png" alt="Grid Edit"/><br/>

Each Qrimp app comes with many default views.

<h2>Creating links to Views (for menu tabs and more)</h2>

In the location bar of your browser, you'll see the <a href="/db.aspx?t=HelpTopics&id=261&vid=11">url</a> you are on ie: "http://myapp.qrimp.com/db.aspx?t=customers&id=2&vid=11". The vid=11 tells the app to use view 11, which is the detail view. Changing the vid in your url will show you a different view. Note that if you are on a custom page or a page with a [clean url]) you will not see the vid. (See also [Query String Parameters])
Click the "Customers" tab to see the following screen, customers, displayed in Grid View (vid=1).

<img src="attachments/de08c23c-a1b5-4c0d-9972-4ff0c4668c17/ShipCustomer.jpg">

Try to open a table with the XML View, which has an id of 19. Go to a table and edit the query string in the URL so that "vid=19". Qrimp will apply the XML View to the data being returned on the page.

<img src="attachments/be8b1ffe-a495-41a4-8fba-a7ef3d8cad2f/XMLvIew.jpg">

<li>Here is a list of fields for a template and what they mean:
<h5>Name</h5>
<p>This is the name of the view for easy reference or for adding to the query string using the vid=name parameter. You can also use the ID of the view.
<h5>Description</h5>A description of your view
<h5>Displayid</h5>This tells Qrimp how to display the data, do you want your data in a table format like in the grid view or do you want it in a list. Most views you create will be a repeater. These controls are based on the ASP.NET <a href="http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.repeater.aspx">Repeater Control</a> and the <a href="http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.datagrid.aspx">DataGrid Control</a>.
<h5>Header</h5>The header content will appear above any data that is pulled from the database.
<h5>Footer</h5>The footer content will appear below any data that is pulled from the database.
<h5>ItemTemplate</h5>The item template is the HTML code that formats the display. If you are using a Repeater type view, then this HTML will format one complete record from the database. In a table type view, the item template will be applied to each column. In the table view, if there is no item template, then the template for the column is obtained from the [Field Templates].
<h5>CellTemplate</h5>In a repeater view, this should probably always be [DATA]. If you'd like to wrap the item template with an extra bit of HTML, you can add it here.
<h5>PageSize</h5>How many records to display by default. You can override this setting in the url using the &pagesize= parameter.
<h5>ContentType</h5>The content type tells the browser how to display the data. If blank, text/html is assumed. If you want to display xml, use text/xml.
<h5>EnableWiki</h5>If EnableWiki is true, square bracketed items will be hyperlinked.

<h2>Advanced: Building a New View</h2>
The easiest way to create your first View is to copy an existing view and then modify it. To copy a View, Go to Design > Views > Select the edit icon next to the View you want to copy > Scroll down to the bottom of the page > click the Copy button > Click the edit icon > edit the HTML > Save your edits with a new name.
</nobreak>
Display and Design
deleteedit177Copying a ViewThe easiest way to get started with creating a custom View is to copy an existing one and then modify it to suit your needs.
To copy a View, follow the following steps:

1.In the Menu, navigate to Design > Views

<img src="attachments/0bbdd80e-5990-44c6-98d5-04968c44cfb2/DesignViewCopy.jpg">

2.In the Page Templates grid, select the edit icon (<img src="/attachments/e88589d8-11ab-415a-96db-2f99d5a3d4d6/EditIcon.png">) next to the View that is similar to the one you want to create.

<img src="attachments/2defb493-d6b6-4856-a12b-ef2c4ecbf989/ViewPageTemplates.jpg">

3.Scroll down to the bottom of the page and click the Copy button: <img src="attachments/a19ee9e7-e360-4d13-a410-8e0167ff4d63/CopyButton.jpg">


4.Now click the edit button --<img src="attachments/2f4e8ee1-f590-4494-b445-6d65237db30b/EditButton.jpg"> -- and begin creating your new custom View.
Creating your own views
deleteedit179Custom Pagination Look and FeelTo create your own Custom Paging for your system you will have to write some [JavaScript].

First, you will call the subset of numbers from the database that you will want to use to create the custom pagination.

You can call the subset two ways: JSON or XML.

If you use JSON:

<div style="border: 2px black solid; font-family:monospace; background: #f3f3ff; padding: 1em; overflow:scroll white-space: nowrap ;">paginationJson = getUrlString('db.aspx?t=Inventory&vid=73&noheader=true&nofooter=true&_pagingInfo=JSON' + filterQueryString)</div>

This URL will pull the subset of numbers

<div style="border: 2px black solid; font-family:monospace; background: #f3f3ff; padding: 1em; white-space: nowrap ";">{"paginationInfo":{"pageSize":9,"numPages":9,"numRecords":79,"currentPage":1}}</div>

Then you must parse the information. In the example we pull the parser from the Yahoo JavaScript Library.

<div style="border: 2px black solid; font-family:monospace; background: #f3f3ff; padding: 1em; white-space: nowrap ;"> try {
var paginationInfo = YAHOO.lang.JSON.parse(paginationJson).paginationInfo;
}
catch (e) {
alert(e);
}</div>

Finally, you can assign the global variables and begin to manipulate the page to create your own Custom Pagination.

<div style="border: 2px black solid; font-family:monospace; background: #f3f3ff; padding: 1em; overflow: scroll; white-space: nowrap ";">numPages = paginationInfo.numPages;
currentPage = paginationInfo.currentPage;
numItems = paginationInfo.numRecords;
pageSize = paginationInfo.pageSize;</div>



If you use XML you will parse the information differently

<div style="border: 2px black solid; font-family:monospace; background: #f3f3ff; padding: 1em; overflow: scroll; white-space: nowrap ">try //Internet Explorer
{
xml=new ActiveXObject("Microsoft.XMLDOM");
}
catch(e)
{
try //Firefox, Mozilla, Opera, etc.
{
xml=document.implementation.createDocument("","",null);
}
catch(e)
{
alert(e.message);
}
}
var url = 'db.aspx?t=inventory&vid=73&qid=3&_paginginfo=true';
xml.async=false;
xml.load(url);
//<paginginfo><pagesize>25</pagesize><numpages>0</numpages><numrecords>92</numrecords><currpage>1</currpage></paginginfo>
document.write('numpages=' + xml.getElementsByTagName("numpages")[0].childNodes[0].nodeValue + '<br>');
document.write('pagesize=' + xml.getElementsByTagName("pagesize")[0].childNodes[0].nodeValue + '<br>');
document.write('numrecords=' + xml.getElementsByTagName("numrecords")[0].childNodes[0].nodeValue + '<br>');
document.write('currpage=' + xml.getElementsByTagName("currpage")[0].childNodes[0].nodeValue + '<br>');
</div>

As you can see XML does its own set of calls for the parsing. IE and other browsers are different so the beginning is checking to see what browser it is. Then the numbers get called in the query string just like JSON. The main difference is the way the strings are parsed.

Now you can manipulate the variables to the your type of Custom Pagination.

Here is an example of a 'footer' Custom Pagination for a shopping cart of items.

<div style="border: 2px black solid; font-family:monospace; background: #f3f3ff; padding: 1em; overflow: scroll; white-space: nowrap ">
function createItemListFooter () {

paginationJson = getUrlString('db.aspx?t=Inventory&vid=73&noheader=true&nofooter=true&_paginginfo=json' + filterQueryString);

try {
var paginationInfo = YAHOO.lang.JSON.parse(paginationJson).paginationInfo;
}
catch (e) {
alert(e);
}

numPages = paginationInfo.numPages;

currentPage = paginationInfo.currentPage;
numItems = paginationInfo.numRecords;

var paginationHtml = "";

for (var i = 1; i <= paginationInfo.numPages ; i++) {
if (i == 1) {
paginationHtml = paginationHtml + "<div id=page" + i + " class=\"selectedPage pageNumber\"><a href=\"#\" onclick=\"displayPage(" + i + ")\">" + i + "</a></div>";
} else {
paginationHtml = paginationHtml + "<div id=page" + i + " class=pageNumber><a href=\"#\" onclick=\"displayPage(" + i + ")\">" + i + "</a></div>";
}
}

if (paginationInfo.numPages > 1) {

paginationHtml = paginationHtml + "<div id=nextButton class=prevNextButtons><a href=\"#\" onclick=\"nextPage()\">Next</a></div><div id=prevButton class=\"prevNextButtons hide\"><a href=\"#\" onclick=\"previousPage()\">Previous</a></div>"
}

document.getElementById("itemListFooter").innerHTML = paginationHtml;
}

function displayPage (pageNumber) {

if (pageNumber != currentPage) {

YAHOO.util.Dom.removeClass("page"+currentPage, "selectedPage");
YAHOO.util.Dom.addClass("page"+pageNumber, "selectedPage");

if (pageNumber == 1) {
YAHOO.util.Dom.addClass("prevButton", "hide");
} else if (currentPage == 1) {
YAHOO.util.Dom.removeClass("prevButton", "hide");
}


if (pageNumber == numPages) {
YAHOO.util.Dom.addClass("nextButton", "hide");
} else if (currentPage == numPages) {
YAHOO.util.Dom.removeClass("nextButton", "hide");
}

currentPage = pageNumber;

displayItemList();

}

}

function nextPage() {
displayPage (currentPage + 1);
}

function previousPage() {
displayPage (currentPage - 1);
}
</div>

This code manipulates the JSON from the above example to create this:

<img src="https://developer.qrimp.com/attachments/664353d5-59b5-4408-90db-7a08300aefe3/PaginationFooter.png">

<img src="https://developer.qrimp.com/attachments/218508a3-c74d-404a-86e4-e52ca0e0cae5/PaginationFooter1.png">
Javascript and JQuery in Qrimp
deleteedit180Changing the LogoYou can change the logo that appears in the top left corner of your app to your company logo. Save a copy of your logo with a maximum width of 150 pixels and a maximum height of 80 pixels.

First, upload your logo as an attachment in your Qrimp app. See [Adding Attachments]

Copy the url where your image is located ie: http://mysite.qrimp.com/attachments/12345mylogo.png

There are two ways to change the logo:

<h2>Changing your logo in the skin (CSS)</h2>

Go to Design > Skins

Search the skin for #logo. Change or add the background element so the url for the background is the file location of your image, as below. <strong>Every character as symbol is needed, so type carefully!</strong>

#logo{
background: transparent url("http://mysite.com/attachment/12345mylogo.png") no-repeat scroll 0%;
top: 25px;
left: 1px;
width: 200px;
height: 100px;
}
<h2>Remove the logo altogether</h2>
If you just want to remove the logo, you can comment out the 'background' line for the logo style, like this:

#logo{
/*background: transparent url("http://mysite.com/attachment/12345mylogo.png") no-repeat scroll 0%;*/
top: 25px;
left: 1px;
width: 200px;
height: 100px;
}

Or mark it as none:

#logo{
background: none;
top: 25px;
left: 1px;
width: 200px;
height: 100px;
}

<h2>Adding a logo to a Custom Header</h2>
Below the Edit Skin section you can create a custom site header see [Site Header]. You can enter whatever HTML you wish in there, including the image link to your logo image. Note that if your logo is contained in a div called #logo, the CSS from the default Qrimp app skin, positions.css, will also apply to the div.

If you do this, the existing contents of your table header, such as your login link and search form will be overwritten, so be sure to include these in your site header as well.
Changing the Look and Feel of Your App
deleteedit181PortalsPortals are windows to your data that appear in boxes on your [dashboard]. Your Dashboard is a collection of portal boxes. Each user must add or subscribe to their own set of portals. A user can either add a portal from the [grid view] or subscribe to a portal.

<img class="border" width="500" src="attachments/developer.qrimp.com-1065e4df-66f4-4bb4-b06a-592170c5c577/severalportals.png" />

<h2>Adding a Portal from Grid View</h2>
To add a portal from the [grid view]:

Go to the table you want to get data from > go to the bottom of the grid view > click the link that says "Share".
<img class="border" width="500" src="http://f43a933af7ac34dcec6f-e68f0ae55bed6d6f943b932cc8d70ccb.r3.cf1.rackcdn.com/2e747ef8-e2cd-4287-a53c-a0bff069e41a-add%20portal%20screen%201.png">
A box will appear with a button that says "Add to Dashboard". Click the Add to Dashboard button.
<img class="border" width="500" src="http://f43a933af7ac34dcec6f-e68f0ae55bed6d6f943b932cc8d70ccb.r3.cf1.rackcdn.com/d8b3d7b5-ea0e-41ae-8e7b-f69ff520ecda-add%20portal%20screen%202.png">
Enter a name for your dashboard.
<img class="border" width="500" src="http://f43a933af7ac34dcec6f-e68f0ae55bed6d6f943b932cc8d70ccb.r3.cf1.rackcdn.com/bdc8b545-026b-4fd1-901e-47b4a6c01fa5-add%20portal%20screen%203.png">
Another link will appear that lets you view your dashboard
<img class="border" width="500" src="http://f43a933af7ac34dcec6f-e68f0ae55bed6d6f943b932cc8d70ccb.r3.cf1.rackcdn.com/16d83cf4-6cf0-4ff1-9a22-0658792a4c39-add%20portal%20screen%204.png">
Your portal window has been added.
<img class="border" width="500" src="http://f43a933af7ac34dcec6f-e68f0ae55bed6d6f943b932cc8d70ccb.r3.cf1.rackcdn.com/16ed92a2-04f0-46c2-8de5-037cdb1bd4e4-add%20portal%20screen%205.png">

<h2>Moving Portals</h2>
To move a portal, go to the top right corner of the square. Hover over the icon that looks like two windows <img class="move" src="/c6401/559.png" align="absmiddle" height="16" width="16">". It will turn to a multi-directional arrow <img class="move" src="attachments/developer.qrimp.com-d9b3232d-9b06-4b91-97b4-27c53bbb9207/multi-directionalarrows.png" align="absmiddle" height="16" width="16">. Click and drag the arrow to move the portal to a spot before another portal square. The square you are moving it in front of will turn green.

<h2>Resizing Portals</h2>
To resize a portal, click the magnifying glass icon in the top right <img src="/icons/crystal_project/32x32/actions/viewmag.png" />. You can change it to be large, small or medium.

<h2>Customize Portal Background Colors</h2>
To choose a new background color for a portal, click the palette icon in the top right <img src="/icons/crystal_project/32x32/apps/colors.png" />. Different colors can help you quickly find data that looks the same.

<h2>Advanced: Manually Editing Portals</h2>
To edit a portal, click on the edit icon in the top right corner of the square <img src="/icons/crystal_project/32x32/apps/kate.png" />. This will take you to the edit view of that portal in the Portals table. Note: You can see all of the records in the portals table by going to Design > Portals.

Name: The Name of your portal window. Use a name that describes which data will appear in the portal and how it will appear. For example "Logins by Date", "Unpaid Bills" or "Red Shoes - Thumbnail images". The name you choose will appear in the header of the portal.

Description: Describe your portal to help you remember what it's about.

Template: Copy and paste a [ShareData] script. The ShareData script is much like an embed tag. It links to your data, storing the table id, the sort on your data, search information, hiddencolumns and whatever else you tell it to. Advanced: add styles to your portals by using inline styles in the template field.

Link: The Portal Link specifies where the user will go if they click on the portal header.

<h2>Deleting Portals</h2>
To delete a portal from your home page, click the red X in the top left hand corner. You will be unsubscribed. To resubscribe, simply go to Home and find the link in the top left of the page that says "Add Portal".
Dashboard
deleteedit182Adding a User GroupUnder Admin > [User Groups] you will find the default Groups: Administrators, Developers, Testers, Users and Anonymous. To add a new group, click the "Add New" Icon in the [Content Header]. Select the group security permissions you would like the user group to have and click Save.Managing Users
deleteedit183ChartsA Help Topic to step through the value of Qrimp's Charts.


In every grid view in your Qrimp Application at the bottom of the data there are a few default buttons.<br><br> <img src="https://developer.qrimp.com/attachments/cd72c5a9-c5c3-4a42-a07f-b473b909f2f6/Charts1.png">

Qrimp does offer a few canned [Reports] but to get your hands dirty with your data Qrimp has Custom and Cross Tab Reports.

When you are in the Grid View, one of the default buttons in the [Content Header] is Reports. If you click on that you will get a screen similar to this <br><br> <img src="https://developer.qrimp.com/attachments/7f9261ba-9fa6-44e0-82ad-30b285b09be9/Charts2.png">

Once you are at this screen you can now see the buttons in the [Content Header] that say Custom and Cross Tab Reports.

Here is an example of a Cross Tab Report. The data is from 2006 and 2007 Most Expensive Zip Codes in the US ranked by Average Median Sale Price. The Report compares the Counties year over year.

<img src="https://developer.qrimp.com/attachments/3333ff85-1242-45a7-b436-92f2a9858993/Chart3.png">

To CHART this Cross Tab report we can go to the bottom of the data and click 'Chart' it will take you to a screen like this.

<img src="https://developer.qrimp.com/attachments/b5afa6f3-8ffc-44cf-9cb3-21646fd50143/Charts4.png">

There are several ways to change the look and feel of your chart.

Lets begin with the Chart Title. The Chart title will appear above the Chart.

<img src="https://developer.qrimp.com/attachments/1df430b9-0290-4316-b0c6-b6e68fce36df/NewChart1.png">

The View Next button allow you to scroll through various charts to represent the data in a different way. Here is the same chart as above after Clicking "View Next". You can also use the Drop Down Menu located to the left of the "View Next" button.

<img src="https://developer.qrimp.com/attachments/38c41591-9509-4a97-acd5-5d01c01a9159/NewChart2.png"

The Show Top field allows for adjust of records you want to see. In the two images below is of the same Chart but different amount of records displayed just by changing the "Show Top" field.

<img src="https://developer.qrimp.com/attachments/0d0cc91d-9f06-464b-adee-28f596656497/NewChart3.png">

<img src="https://developer.qrimp.com/attachments/be27b6fc-3b8d-40c8-b815-276438727ef8/NewChart4.png">

The Order By Column allows you to switch the order by which the graph is displayed. By default it is ascending but the radio button next to the field allows you to order by descending as well. This can be seen in action in the two images below.

<img src="https://developer.qrimp.com/attachments/bb041126-8a51-4ec2-b055-059f51b42e97/NewChart6.png">

<img src="https://developer.qrimp.com/attachments/02b7de26-aaf1-469c-842a-e47299079acb/NewChart5.png">

The Dimensions of the Chart can be changed to make the graph more readable. This might be used if the data set is large and the default width and height need to be expanded. The first image is the default size and the second image changes the width and height to make the graph a little more readable.

<img src="https://developer.qrimp.com/attachments/d76c8817-2e05-480c-ba06-e5090ae0aaa5/NewChart7.png">

<img src="https://developer.qrimp.com/attachments/582b3606-fd4e-47bf-af28-ae24af826bac/NewChart8.png">

Sometimes on the x-axis the labels get jumbled together, like the first image below. To make the graph a little more readable there is a Rotate Names radio button that will rotate the names vertically, like in image two.

<img src="https://developer.qrimp.com/attachments/98044458-6b7b-4ab5-bb41-28cfbfeb1e32/NewChart9.png">

<img src="https://developer.qrimp.com/attachments/a44a29d1-f8d8-4ce2-97ec-6e4063f83ead/NewChart10.png">

The "Animate" radio button adds a little functionality to your Chart. If you check the button and click "Show Chart" it will build the Chart right before your eyes. Watch the video below to see it in action.

<embed src="https://developer.qrimp.com/attachments/f5877535-d760-42e0-9d37-a6853c5f72fa/NewChart11.swf" autostart=false height=500 width=1100 />

Sometimes the graphs don't tell the whole picture. By adding values to a chart the User will know the exact amount. So, by clicking the radio button next to "Show Values" the Values will appear on top of the bars, like in image two.

<img src="https://developer.qrimp.com/attachments/bfcb17e4-5e4c-4342-bf59-5772916a18a6/NewChart11.png">

<img src="https://developer.qrimp.com/attachments/05a2d9bf-e70d-48a7-a139-6d0c06de83ed/NewChart12.png">

To make graphs more readable you can add colors to distinguish between each type of bar. By clicking on the palette a color picker box will appear (image 2) and because I have three different labels I will click three different colors. There is no need to close the box each time.

<img src="https://developer.qrimp.com/attachments/3bcf4f9d-5875-43d0-a24d-430126e28c96/NewChart13.png">

<img src="https://developer.qrimp.com/attachments/b7bd7129-f898-4057-b28d-ce7e99938fe1/NewChart14.png">



<strong>The Share button can be used to add Charts to your Portal page. Here is a help topic that will walk you through the process. [Creating A Portal with a Chart]</strong>
Data Analysis
deleteedit185Input Security RestrictionsTo add additional security around data Qrimp allows you to add white and black lists.

A Whitelist will only allow the characters specified in the list.

A Blacklist will strip out the characters specified in the list.

To add either functionality to a system the first step is Develop > System Tables.

<img src="/attachments/f4f304ca-0b5b-4e8c-89b1-85ee86b74279/Security5.jpg">

Then click on the t_groups WITHOUT the magnifying glass.

<img src="/attachments/abb21f03-1668-48e8-a0a7-82df4892155f/Security6.png">

To add the additional field to the table click on the Table Management Icon in the [Content Header]

<img src="/attachments/0ea6eb9a-40f6-4f4a-89d3-34398246ec58/S.png">

Scroll down to "Add a Column" and input either inputwhitelist or inputblacklist all one word

<img src="/attachments/d628e2dc-67b7-4906-a578-b097597ea4ba/Security8.png">

Once the column is added there are two steps. First you must log out and log in to make the change take effect. Then go back to the table and click Design > Field Layout to move the field to a usable spot.

It should look like this when complete. Now click the Edit Icon in the [Content Header] enter in the characters that can ONLY be entered. For this example lets say I don't want numbers. I will only include the 26 letters of the alphabet and click save.

<img src="/attachments/651ac779-8356-460b-8f2f-a3b3f84ea600/Security9.png">









The System Tables
deleteedit186Retrieving id for new elementsIf you use JavaScript to create a new item, you may want to retrieve the ID of the element just created. To do this, use the _returnresult=true option in the querystring.

For example, submitting a querystring like the following will create a new item in the Person table with a name of Linda.

var id = getUrlString('db.aspx?t=person&name=linda&o=5&_returnresult=true');

You can now use the value in ID to add information to other tables that is related to the person Linda. Like this:

var taskid = getUrlString('db.aspx?t=tasks&name=Register+for+intranet&person=' + id + '&o=5&_returnresult=true');

Javascript and JQuery in Qrimp
deleteedit187Creating a Portal with a Chart<a href="db.aspx?t=HelpTopics&vid=11&id=183">Charts</a> and <a href="db.aspx?t=HelpTopics&vid=11&id=57">Reports</a> make good additions to [portals] as they provide a quick overview of your data.

To add a chart to a portal page, first find the chart of your liking. For the example I'm going to use the most expensive zip codes by county year over year. Before you click the Share button don't forget to copy the script inside the text box. (Shown in figure 2)

<img src="https://developer.qrimp.com/attachments/0ab33145-8a74-4cd7-afa6-4ae6242c25fe/Chart8.png">

After you click the Share button it will take you to a Create portal page.

<img src="https://developer.qrimp.com/attachments/4e51b730-94a0-4e0a-abfe-449d93d4af08/Chart9.png">

After you click the create button you need to add it to your portal page which will be located in the [Header/<strong>Footer</strong>].

<img src="https://developer.qrimp.com/attachments/c1a68be3-2753-462f-a0b7-033e49aadf6b/Portal1.png">

After you add the portal subscription it should look like this:

<img src="https://developer.qrimp.com/attachments/d9b65d72-7919-43a1-b619-ceebe16b7dae/Chart10.png">






Dashboard
deleteedit188Dependent Select BoxesSometimes it is convenient to allow users of your Qrimp application to filter the items in one select box by choosing an item in another select box. For example, when choosing to examine fuel economy by vehicle, because there are hundreds of different types of cars, you could let your users filter by Make, and then show only the particular models for that make in another box.

In this Help Topic, we will use another example that fits with our Campaign Contributions system, where when choosing a candidate to add a contribution for, you can filter the list by the candidates party. We'll end up with a dependent select box like the image below:
<img src="http://www.qrimp.com/blog/dependent_select_box.png" style='border:solid 1px navy' />

Here is a video that shows the dependent select boxes in action:
<div style='border:solid 1px navy'><object id="csSWF" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="322" height="184" codebase="http://active.macromedia.com/flash7/cabs/ swflash.cab#version=9,0,28,0"><param name="src" value="http://www.qrimp.com/blog/dependent_select_box_animated.swf"/><param name="bgcolor" value="#1a1a1a"/><param name="quality" value="best"/><param name="allowScriptAccess" value="always"/><param name="allowFullScreen" value="true"/><param name="scale" value="showall"/><param name="flashVars" value="autostart=false"/><embed name="csSWF" src="http://www.qrimp.com/blog/dependent_select_box_animated.swf" width="322" height="184" bgcolor="#1a1a1a" quality="best" allowScriptAccess="always" allowFullScreen="true" scale="showall" flashVars="autostart=false" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></embed></object></div>

To get started, we will first go to the Add New screen for the Contributions. Notice the default select box has only a list of candidates:
<img src="http://www.qrimp.com/blog/contributions_addnew.png" style='border:solid 1px navy' />

From the add new screen for contributions, select Design > Field Templates:
<img src='http://www.qrimp.com/blog/contributions_field_templates.png' style='border:solid 1px navy' />



Next, we will click the edit icon for the Candidate column. Since we have not modified the template for this field yet, Qrimp has created one for us automatically that looks like this:
<img src="http://www.qrimp.com/blog/default_candidate_field.png" style='border:solid 1px navy' />

To add a select box for Parties that will filter the candidates list, we will edit the field template to look like this:
<img src='http://www.qrimp.com/blog/candidate_field_template_with_filter_by_party.png' style='border:solid 1px navy' />

Notice we have inserted this block of text before the Candidate select box:
<noeval><blockquote style='border:solid 1px navy;background-color:lightgray'></blockquote></noeval>

This tells Qrimp to create a select box that will filter the Candidate select box and show only those candidates where the party is equal to the party we select in the Parties select box.

If we want to hide the Candidates select box until a selection in the Parties select box has been made, we can use code like this:
<noeval><blockquote style='border:solid 1px navy;background-color:lightgray;'> then <span id=Candidate_selectbox>Candidate</span></blockquote></noeval>

The span indicated with the id <strong>Candidate_selectbox</strong> is the location where Qrimp will display the list of candidates in the party that we choose in the Parties box. This example behaves like the video below:

<div style='border:solid 1px navy'><object id="csSWF" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="387" height="342" codebase="http://active.macromedia.com/flash7/cabs/ swflash.cab#version=9,0,28,0"><param name="src" value="http://www.qrimp.com/blog/dependent_select_box_hide_original_select.swf"/><param name="bgcolor" value="#1a1a1a"/><param name="quality" value="best"/><param name="allowScriptAccess" value="always"/><param name="allowFullScreen" value="true"/><param name="scale" value="showall"/><param name="flashVars" value="autostart=false"/><embed name="csSWF" src="http://www.qrimp.com/blog/dependent_select_box_hide_original_select.swf" width="387" height="342" bgcolor="#1a1a1a" quality="best" allowScriptAccess="always" allowFullScreen="true" scale="showall" flashVars="autostart=false" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></embed></object></div>

Your final output should be in this format:
<pre>
then <span id='TABLE_WITH_DATA_TO_FILTER_selectbox'>COLUMN_NAME</span>
</pre>
The code above is telling Qrimp to display a SELECT box with data that is used to filter another select box that ultimately has the list of items of which one is the desired selection for the field in this table.

So for example, if you are creating a trouble ticket system for equipment and have 100 pieces of equipment, each with an EquipmentType and you want to make it easy for your users to select just one piece of that equipment, you'd use a command like the following:
<pre>
then <span id='Equipment_selectbox'>Piece of Equipment</span>
</pre>



Field Templates
go to page: 1 2 3 4 5 6 7 8 9 10 243 records. Showing