Insert a value into a K2 control via JQuery

Sometimes there are operations that are not feasible or hardly feasible on K2. But that we can do via JQuery, only we need to store in a K2 control the result that the JQuery code returns. How to do it?  😕  

Let’s imagine this case: We have a list view containing the list of students of a class, and we want to display the first three students of a list without user interaction after loading the view. As below:

Insérer une valeur dans un contrôle K2 via JQuery

  • How to do it without user interaction?  😯 
  • Answer: By writing in a K2 control via JQuery.  😉

We will use JQuery and we will do it in two steps:

  1. Retrieve the first three rows of the list view
  2. Insert the retrieved rows in a K2 control (DataLabel)
  3. Trigger the JQuery code snippet

Let’s go !!!  😎

  1. Retrieve the first three rows of the list view

First we should add a DataLabel on the view to identify the view (in our case we will call it dl_FirstStudentName). Then from this Data Label we will use this piece of code :

a) Recovery of the 1st line

$('span[name="dl_FirstStudentName"]').closest('.grid-toolbars').siblings('.grid-body').find('.grid-body-content tr:first td:first span').text()
Récupération de la 1er ligne

 

b) Recovery of the 2nd line

$('span[name="dl_FirstStudentName"]').closest('.grid-toolbars').siblings('.grid-body').find('.grid-body-content tr:nth-child(2)  td: first span').text()
Récupération de la 2ième ligne

 

c) Recovery of the 3rd line

$('span[name="dl_FirstStudentName"]').closest('.grid-toolbars').siblings('.grid-body').find('.grid-body-content tr:nth-child(3)  td: first span').text()
Récupération de la 3ième ligne

 

  1. Insert the retrieved rows in K2 control (DataLabel) :

Here is the JQuery code snippet to insert text into a DataLabel :

$("[name='dl_FirstStudentName']").SFCLabel('option', 'text', XXXXX);
Insérer du texte dans un Data Label

The value XXXXX will be replaced by the recovery code of the first three lines which will give us the following code:

<script>$("[name='dl_FirstStudentName']").SFCLabel('option', 'text', 
'1-) ' + $('span[name="dl_FirstStudentName"]').closest('.grid-toolbars').siblings('.grid-body').find('.grid-body-content tr:first td:nth-child(2) span').text() + "\n" + 
'2-) ' + $('span[name="dl_FirstStudentName"]').closest('.grid-toolbars').siblings('.grid-body').find('.grid-body-content tr:nth-child(2) td:nth-child(2) span').text()+ "\n" + 
'3-) ' + <script>$('span[name="dl_FirstStudentName"]').closest('.grid-toolbars').siblings('.grid-body').find('.grid-body-content tr:nth-child(3) td:nth-child(2) span').text());</script>

Let’s insert on our view a Data Label (named dl_JQuery in our case), then create an expression containing expression below this value:

Insérer une valeur dans un contrôle K2 via JQuery : Expression

  1. Trigger the JQuery code snippet

Cette phase nous permet lancer l’exécution de notre code, pour ce faire nous utiliserons une règle sur K2 :Insérer une valeur dans un contrôle K2 via JQuery: Règle

First transfer data is used to empty the Data Label dl_JQuery

Insérer une valeur dans un contrôle K2 via JQuery: Règle

Second transfer data is used to empty the Data Label dl_JQuery

Insérer une valeur dans un contrôle K2 via JQuery: Règle

So we can call our rule when initializing the view:

Insérer une valeur dans un contrôle K2 via JQuery: Règle

We obtain this result

Insérer une valeur dans un contrôle K2 via JQuery

K2 Five Authorization Framework

Did you know that a K2 administrator can control access to K2 objects (category, form, view and smartobject) and entities (user, group and role) by setting permissions (Allow and Deny) on rights (view, execute, modify and delete) ❓

Well, Authorization Framework is a feature in the new K2 Five and Cloud releases, which allows to do this. Hence the purpose of our article.

Read more

Use tab key to navigate between your forms tab

Since browsers have integrated tabs, we all use the tab key to change tabs.

Why not have the same functionality in a K2 form? Read more

Remove selection on elements from a view list without refreshing the view

Any K2 developer has already, at least once in their lifetime, needed to remove the selection on items in a list view. This for a single solution is often offered to us: refresh the view . In this article, we’ll see how to remove this selection without having to refresh the entire view.
Read more

Create a custom worklist without use a custom broker

We often realize that the worklist control used on our Smartforms does not always provide us the features that we need 😡 .For example, we would like to have additional columns on our WorkList showing us in detail the information related to the task or request. As a result, the concept of Custom Worklist is emerging: we are sometimes used to implementing it using custom broker Workflow Management but, in this article, you will find how to do it without using a custom broker 😎

Read more

K2: How to make a detached menu for a list view containing several elements

When you have too many items on a list view, if you are at the bottom of the page, it becomes problematic to be able to add, modify or delete an item because the toolbars “Add”, “Edit”, “Delete” and “Save” are no longer visible. You are required to scroll to the top of the page to see them.

In this article we will show you how to make a detached menu to solve this problem.

Read more

How to: Calculate Working days K2

In the steps below, I show you how you calculate the next working day when we add a number of working days(B) to any date(A),  considering weekends and holidays(C) using K2. Read more

Use a Service Broker that uploads files to OneDrive

Do you want to send files to OneDrive from your K2 application? So, this article will show you how to do it, something simple 🙂

In this article, we will use OneDrive Online, please foudn below the different steps to play with OneDrive file in your K2 app.

Read more

Add pagination on K2 list view editable

Hello !

I’ll  present you an interesting tutorial  😎 : the pagination of an editable list view on K2 . Indeed, K2 allow to add the pagination on a list view that can not be editable. But it not possible to add the pagination on an editable list view. Truce of chatter let us go to the heart of the matter.  😉 Read more