Case study: Quiz - necessary scripts on page Quiz

Page Quiz - webpart Script

We have webpart Script in the page Quiz. It defines both the styles in the page and the script, which is used in the page, itself. Styles are defined in the tab Styles. We defines also CSS class in the webpart. Styles that are applicable just for the particular webpart Script, are then related to this class.

The main functionality of the webpart is on tab Script.

function OnLoad()
{
OGForm.AddControl( OGForm.CreateLiteralControl('l1', '

By filling in the questionnaire you agree with processing of personal data that you provided for the purpose of the quiz evaluation.



Question( 1, 'Which of below claims is true?',
'Free version can be used only for non-commercial purposes and does not provide free update to new versions.',
'Free version can be used also by organizations with more than 25 employees. You can use also more instance in the free mode (without license) – each with max. 25. users.',
'',
'',
'',
'');

...

Question( 7, 'Which claim is not true?',
'Master Data Management enables to get control over critical data, introduce Single Point of Truth, eliminate duplicities and increase data quality.',
'Knowledge Base replaces information scattered in isolated files and allows you to find everything in one place interconnected by links.',
'Collaboration tool replaces chaos in tasks handed over via emails by a central repository with a dashboard for the task solver, task customer, manager, project manager.',
'Project portfolio management allows to manage portfolio of stocks, bonds and other securities.',
'',
'');

gi = OGForm.CreateOGGroup( 'gicontakt', 'Kontaktní údaje', false, false);
OGForm.AddControl( gi);

var r = OGForm.CreateRow();
var c1 = OGForm.CreateCol(false);
var c2 = OGForm.CreateCol(false);

var ti1 = OGForm.CreateOGTitle('ti1', 'Name and surname', true);
var t1 = OGForm.CreateOGText( 'tName', true, null);
var ti2 = OGForm.CreateOGTitle('ti2', 'Email', true, null);
var t2 = OGForm.CreateOGText( 'tEmail', false, null);

c1.Controls.Add( OGForm.CreateItem(ti1, t1));
c2.Controls.Add( OGForm.CreateItem(ti2, t2));
r.Controls.Add(c1);
r.Controls.Add(c2);
gi.Controls.Add(r);
}

function Question( number, question, answer1, answer2, answer3, answer4, answer5, answer6) /*draws the given question*/{
var gi = OGForm.CreateOGGroup( 'gi' + number, number + '. ' + question, false, false);
OGForm.AddControl( gi);

Answer(number, 1, answer1, gi);
Answer(number, 2, answer2, gi);
Answer(number, 3, answer3, gi);
Answer(number, 4, answer4, gi);
Answer(number, 5, answer5, gi);
Answer(number, 6, answer6, gi);
}

function Answer(question_number, answer_number, answer, group) /*draws possible answers for the question*/
{
if ( !OG.IsNull(answer))
{
var rb = OGForm.CreateOGRadioButton( 'rb' + question_number + '_' + answer_number);
rb.Text = answer;
rb.GroupName = 'question' + question_number;
var r = OGForm.CreateRow();
var c = OGForm.CreateCol(true);
c.Controls.Add( OGForm.CreateItem( null, rb));
r.Controls.Add(c);
group.Controls.Add(r);
}
}

We define styles on page Styles - e.g. background colour etc.

div.obsah div.page
{
background-color: white;
}
.quiz fieldset / *adds group edge – relates to the given webpart only, because CSS class quiz is defined in the first tab of the webpart */
{
margin-bottom: 30px;
}
....

Page Quiz - button Save

We will insert button of the type Script into the page.

function GetAnswer(question) /* returns the first checked answer for the given question */
{
for( var i = 1; i <= 7; ++i)
{
var id = 'rb' + question + '_' + i;

if ( OGWebParts['quiz'].OGForm.ExistControl(id) && OGWebParts['quiz'].OGForm.GetControl(id).GetData())
{
return i;
}
}

return 0;
}

var cl = OGModel.ClassDefs['data'];
var dr = OG.DataRow.CreateNew( cl.Id);

dr['name'] = OGWebParts['quiz'].OGForm.GetControl('tName').GetData();
dr['email'] = OGWebParts['quiz'].OGForm.GetControl('tEmail').GetData();


dr['q1'] = GetAnswer(1);
dr['q2'] = GetAnswer(2);
dr['q3'] = GetAnswer(3);
dr['q4'] = GetAnswer(4);
dr['q5'] = GetAnswer(5);
dr['q6'] = GetAnswer(6);
dr['q7'] = GetAnswer(7);

if ( dr['q1'] == 0 || dr['q2'] == 0 || dr['q3'] == 0 || dr['q4'] == 0 || dr['q5'] == 0 || dr['q6'] == 0 || dr['q7'] == 0)
{
OGForm.SetError('Please fill in all the questions.');
}
else if ( OG.IsNull(dr['email']) || OG.IsNull(dr['name']))
{
OGForm.SetError('Please fill in contact data.');
}
else
{
OG.DataRow.SaveData(dr); /* record saving */

OGForm.SetNextRequestSuccess( OG.MessageLoc.GetText(OGModel.Id, 'quiz_success')); /* record saving */

//clear the form
OGForm.RedirectTo( OGContentPage.PageUrl);
}