Has anyone figured js to refresh a specific div or element in knack on event without reloading the whole page?

Help Center Get Answers
1

I've been unsuccessful targeting specific elements on a page using .load in jquery. If anyone has had success with this I'd appreciate a hint.

2

Hi all,

I stumbled upon this issue recently as I have in the same page both tables and a forms and one field of a form depends of the content o a table hence every time I do my update on that table (adding new items through an API call) I need a connected field of a form to contain, as options, the new created items.

In fact, I am updating first the tables through the usual Knack.views.view_xxx.model.fetch() function which as explained works only on tables.

To make the form view re-render, I am using successfully the Knack.views.view_xxx.render() function. 

Hope this helps

Cheers,
Davide

3

@Rich Thanks so much for this, very useful.

Much appreciated

Phil

4

@phil Thanks so much. This is been dogging me for a long time. :)

5

@phil  If your api request is being sent from the browser ie the js console in knack you could drop this function in the success portion. If you're using an external api then just put the table refresh on a timeout and the user will never know it's constantly refreshing in the background.

6

@Phil  We do this quite a bit.   Apologies for the lack of code snippets.

The trick is to use a promise or an await to wait until after the record is done inserting before refreshing.   Here's a small snippet.

 

CIMS.insert_knack_record('scene_391/views/view_1960',
{ jsonpayload}).then(function() {
    Knack.models.view_2421.fetch()
}

The CIMS.insert is just a wrapper we wrote in a little library.

 

var CIMS = {

.....
insert_knack_record: function (url,data,args) {
//Housekeeping
args = ( typeof args != 'undefined' && args instanceof Object ) ? args : {}
url = "https://api.oururl.com/v1/pages/" + url + "/records";
var def = new $.Deferred();

//The POST to insert a new record.   
$.ajax({
url: url,
type: "POST",
headers: {"X-Knack-Application-Id":Knack.application_id,
                "Authorization":Knack.getUserToken(),
                 "X-Knack-REST-API-Key": "knack"
},
data: data,
success: function(data, textStatus, xhr) {
              console.log("Inserted a record!")
              def.resolve(data.record.id, args);

},
error: function(xhr) {
              def.resolve(false,xhr.responseText)
 }
});
return def.promise();
}

7

My apologies.  This is the working code, you have to use .render in the callback.

 

var a = {};

a.success = function () {
    Knack.views.view_2366.render()
}
Knack.views.view_2366.model.fetch(a)

8

We have records added via API, I'd like to be able to call the .model.fetch() externally via API. Eg new record added, therefore refresh the table to view.  Any ideas?

9

Thanks Rich. I could not get this to work. Not sure what I'm doing wrong.  Can you please post a simple example? It would be appreciated.

10

poked around a bit.   You're looking for Knack.views["view_ID"].render ,  call this after calling  Knack.views["view_ID"].model.fetch() 

11

Hello Justin,

 

No it's works only for table here also don't know . If you found please also let me know.

Currently i use some javascript to perform this . Like click on link again so knack does this .

 

Regards,

Sunny Singla

ssingla1985@gmail.com

+919855089359

12

Thanks Sunny. I just found that on a separate thread and was playing around with it.

It doesn't seem to work on forms though, only tables. Any idea how to refresh to form data without fully reloading the page?

13

Hello Justin,

 

yes you can using "Knack.views["view_ID"].model.fetch()"

 

Regards,

Sunny Singla

ssingla1985@gmail.com

+919855089359