Avatar

Update Related Records Using JavaScript API

Christopher Krieg

Hello,

I'm trying to fill in the "Related Records" field with results from my own query using the JavaScript API. I'm using the below code to fetch the data. Since this function returns an array of records, can't I just load them in the related records field by using its field code? Is this even possible?

var rec = event.record;
        var customer = rec.Customer.value;
        var start_period = rec.Start_Period.value;
        var end_period = rec.End_Period.value;
        var query = 'Customer="'+ customer +'" and Start_TIme >= "'+ start_period +'" and Start_TIme <= "'+ end_period +'"';
        
        var getAllSummaryDetailsWithQuery = function() {
                var body = {
                    app: HOURS_LOG_APP_ID,
                    query: query
                };
                return kintone.api(kintone.api.url('/k/v1/records', true), 'GET', body).then(function(resp) {
                    if ( resp.records.length === 0 ) {
                        alert("No data was returned.");
                        return event;
                    }
                    return resp.records;
                }).catch(function(error){
                    console.log("Request couldn't complete.");
                });
            };
Follow 2 followers
0

2 comments

Avatar
Sean Tachibana 2 votes

Hi Christopher,

 

It is not possible to use the API to update the information in the related record based on the result retrieved by GET.

The desired process cannot be achieved using the standard fields of kintone, including related records, so you need to create your related records.

Below is a sample code based on two apps, the class management app and the student management app.

(the code is applied to the class management app)

 

Class management app:

Field Type             Field Name        Field Code                Remark

Record Number   Class number   class_no                          -

Text                       Class code        class_code                      -

Text                       Class name       class_name                     -

Space                           -                  student_list      Space for table display

 

Student management App:

Type of field               Field name              Field code              Remark

Record number         Student number      student_no                 -

Text                            Student code           student_code              -

Text                            Name                        student_name             -

Lookup                      Class code               class_code              Table

Text                            Class name              class_name             Table

 

(function() {

'use strict';

kintone.events.on(['app.record.detail.show', 'app.record.edit.show'], function(event) {

var record = event.record;

// Avoid proliferation bugs

if (document.getElementById('student_list') !== null) {

return event;

}

// To HTML escape

function escapeHtml(str) {

return str

.replace(/&/g, '&amp;')

.replace(/</g, '&lt;')

.replace(/>/g, '&gt;')

.replace(/"/g, '&quot;')

.replace(/'/g, '&#39;');

}

// Get space

var subtableSpace = kintone.app.record.getSpaceElement('student_list');

// Rest API

var params = {

'app': '{Student Management AppID}',

'query': 'class_code in ("' + record.class_code.value + '") order by student_no asc limit 500',

'fields': ['$id', 'student_code', 'student_name']

};

kintone.api(kintone.api.url('/k/v1/records', true), 'GET', params).then(function(resp) {

// success:Display list of students

var tableRecords = resp.records;

var studentTable = '<table class="kintoneplugin-table">';

studentTable += '<thead>';

studentTable += '<tr>';

studentTable += '<th class="kintoneplugin-table-th" style="width: 250px;">';

studentTable += '<span class="title">';

studentTable += 'code';

studentTable += '</span>';

studentTable += '</th>';

studentTable += '<th class="kintoneplugin-table-th" style="width: 250px;">';

studentTable += '<span class="title">';

studentTable += 'Name';

studentTable += '</span>';

studentTable += '</th>';

studentTable += '</tr>';

studentTable += '</thead>';

studentTable += '<tbody>';

for (var i = 0; i < tableRecords.length; i++) {

studentTable += '<tr>';

studentTable += '<td>';

studentTable += '<div class="kintoneplugin-table-td-control">';

studentTable += '<a href="/k/104/show#record=' + escapeHtml(tableRecords[i].$id.value);

studentTable += '" target="_blank">';

studentTable += escapeHtml(tableRecords[i].student_code.value);

studentTable += '</a>';

studentTable += '</div>';

studentTable += '</td>';

studentTable += '<td>';

studentTable += '<div class="kintoneplugin-table-td-control">';

studentTable += escapeHtml(tableRecords[i].student_name.value);

studentTable += '</div>';

studentTable += '</td>';

studentTable += '</tr>';

}

studentTable += '</tbody>';

studentTable += '</table>';

subtableSpace.innerHTML = studentTable;

}, function(error) {

// error:Display a message in case of error

var errmsg = 'An error occurred while retrieving the record';

// If the response contains an error message, display the message

if (typeof error.message !== 'undefined') {

errmsg += '\n' + error.message;

}

subtableSpace.appendChild(document.createTextNode(errmsg));

});

return event;

});

})();

※Replace the '104' part of '<a href="/k/104/show#record=' with the app ID of the student management app.

Could you try and see if this accomplishes the desired process?

Hopefully, it helps.

2
Comment actions Permalink
Avatar
Christopher Krieg 0 votes

Hi Sean! 

Thank you so much for all your help! That worked perfectly. I wasn't sure how to create the custom HTML table so now I can using this method in future projects!

Much appreciated,

Chris Krieg

0
Comment actions Permalink