Some Javascript Help

API & Customization
1

Can someone help me with writing a some javascript code?

I'm looking to add a button into a details view that will use the ID of the record as well as the field inside the Link.

For example:

in Scene 43, view 69 on the top I want to add a link similar to:

<a href="/dashboard/#jobs/edit/{id}/{field_172)/{id}">Update</a>

ID should be the current ID of the record.

Field_172 is just a short text without any spaces.

Any help would be very much appreciated.

2

You should mark this post as answered.

:)

3

I'm so glad I could help! Best of luck with the rest of your project :D

4

YES YES YES!!! THAT WORKED!!! Thank you so so much, that makes my life so much easier.

I needed this because I have records that depending on which option is chosen it routes you to that specific edit page. Meaning if Option1 is chosen it goes to an edit page that only has options related to that option1 choice. I found this to be much easier than creating a million display rules. This is so great!!

Thanks a million Bejamin.

5 

Try:
$(update_link).insertBefore('.view-header');

and let me know :slight_smile:

6

Benjamin, I really appreciate your help with this. Here is the code I currently have:

$(document).on('knack-scene-render.scene_74', function(event, scene) {

/* first pluck out the values you need */
var current_id = $(".field_395 .kn-value").text();
var other_val = $(".field_304 .kn-value").text();
     
/* then build your link */
var update_link = '&lt;a href="/dashboard/#jobs/edit/'+current_id+'/'+other_val+'/'+current_id+'"&gt;Update&lt;/a&gt;';
 
/* use jQuery to place the link where you want it using one of the placement functions
    like insertBefore/after/prepend / etc. */
update_link.insertBefore('.view-header');



});

I’m really not great with Javascript so its possible I’m messing up something very minor even. Not sure.

7

You are welcome, Moe. Could you please just include all your javascript here? I can help you debug.

8

Benjamin, thanks so much for your code, I really appreciate it and can't believe I didn't realize you responded 17 hours ago. I just tested it and can't seem to get it to work... in the console the only error I get is: "Uncaught TypeError: update_link.insertBefore is not a function" do you know why that would be?

Thanks so much again!!!

9

Sorry I didn't include this yesterday - let me know if this helps.

$(document).on('knack-scene-render.scene_{#}', function(event, scene) {

/* first pluck out the values you need */
var current_id = $(".field_{#} .kn-value").text();
var other_val = $(".field_172 .kn-value").text();

/* then build your link */
var update_link = '&lt;a href="/dashboard/#jobs/edit/'+current_id+'/'+other_val+'/'+current_id+'"&gt;Update&lt;/a&gt;';

/* use jQuery to place the link where you want it using one of the placement functions
	like insertBefore/after/prepend / etc. */
update_link.insertBefore('#element');



});

10

If the link you are creating is to a Knack form, then you can add an "Edit" link to any detail view using the "Special" tab when you are modifying the view. You can also link to any other existing view.

If your link is going somewhere outside of Knack and you need to truly construct it, then this is what I have done:

  1. Add a view at the end of your scene that has the fields you need values from.
  2. Use the display rules to hide it (like, if ID is not blank, hide it so it's always hidden)
  3. Create a javascript wrapper for the scene load, and use jquery to pluck the data values out of the hidden view into variables
  4. Use the variables to construct your link w/ URL in a new javascript variable
  5. Use jQuery to insert the link wherever you want it using insertBefore/After, prepend, etc..

Let me know if that doesn't make sense or if you would benefit form a code sample. I hope this helps.

Benjamin