How do I retrieve a field value from a calendar popup using jquery

To Whom is feeling generous,


I need to retrieve a value from from a calendar modal popup and hide some elements displayed in that modal based on the value. Knack doesn't make this easy.

I've managed to target the calendar modal and the field but I cannot figure out how to retrieve the value of the field in a calendar modal.

Her's where I am so far.

$(document).on('knack-modal-render.view_29', function(event, view, record) {
var status = $('.field_112 > td:nth-child(2) > span:nth-child(1)').val;
alert(status);
});

This brings up the following value in the alert:

function (e){var n,r,i,s=this[0];if(!arguments.length){if(s)return n=v.valHooks[s.type]||v.valHooks[s.nodeName.toLowerCase()],n&&"get"in n&&(r=n.get(s,"value"))!==t?r:(r=s.value,typeof r=="string"?r.replace(R,""):r==null?"":r);return}return i=v.isFunction(e),this.each(function(r){var s,o=v(this);if(this.nodeType!==1)return;i?s=e.call(this,r,o.val()):s=e,s==null?s="":typeof s=="number"?s+="":v.isArray(s)&&(s=v.map(s,function(e){return e==null?"":e+""})),n=v.valHooks[this.type]||v.valHooks[this.nodeName.toLowerCase()];if(!n||!("set"in n)||n.set(this,s,"value")===t)this.value=s})}

Not really what I was looking for but at least it's no longer 'undefined'

Is it possible to retrieve the text value of the field to trigger the rest of my code?

Any help would be sincerely appreciated.

Hi Brad,

I got this working with some help from my code guru.

It turns out the selector was incomplete and I needed to return .text rather than .val.

Here's what the code looks like in the end. I hope it helps someone out there with the same issue.

//conditionally hide links on calendar modal render

$(document).on('knack-modal-render.view_29', function(event, view, record){
setTimeout(function(){

//establish variables for the elements you'd like to conditionally hide


$accept = $("#kn-modal-details div.kn-details-group.column-3.columns > div:nth-child(1)");
$decline = $("#kn-modal-details div.kn-details-group.column-3.columns > div:nth-child(2)");
$suggest = $("#kn-modal-details div.kn-details-group.column-3.columns > div:nth-child(3)");

//get value you'd like to trigger your code on


var status = $('#kn-modal-details .field_112 > td:nth-child(2) > span:nth-child(1)').text();
//because this is a span must use .text
console.log (status); //make sure you're getting the right value

//define switch cases and actions


switch(status){
case "Pending": return;
case "Accepted": return hideAcceptDecline();
case "Blocked/Non Working": return hideAll();
case "Cancelled": return hideAll();
case "Declined": return hideAll();
}

//groups variables to hide in a function


function hideAll(){
$accept.hide();
$decline.hide();
$suggest.hide();
}

//groups variables to hide in a function


function hideAcceptDecline(){
$accept.hide();
$decline.hide();
}
},1) //set timeout value
});

Perhaps if we can find a way to capture the record ID - then we could reference the record in a separate view using a token, return the field value from that view and then execute the rest of the code based on it's value. So far the recordid has proven equally elusive for me.

Thanks Brad - I'll second that request now. If I find a solution or a workaround I will post.

Here's the feature request I've logged: https://support.knack.com/hc/en-us/community/posts/115000630732-Make-calendar-event-view-and-add-forms-child-forms

Thanks Justin - your goals make sense, and it would be better to have the event view or add forms as child forms in the designer and then full access to view rules amongst other functions. We should add a feature request for it...

I haven't got much further than you yet - confirmed the view trigger for the modal works, but i can't seem to get the data in a usable form yet and being a model without a linked view the Knack.models function won't work (I've confirmed that).

It's late here in Oz so I'll have another crack when my brain is fully functional.

Hi Brad,

So, what's prompting this is that Knack does not provide the ability to add rules to the 'Event Details' or the 'add event form' modals from a calendar view. Specifically display rules would be helpful in this scenario.

My plan is to find the value of a currently displayed field (field _112) and to trigger other elements in the view to be hidden depending on it's value. Specifically, links to edit the record, for which it does not make sense to display when the condition is x.

If the page weren't a modal it would be fairly easy to execute. Any help would be sincerely appreciated.

Here's with the field looks like in the inspector:



Here's the selector:

#kn-modal-details > div > section > div > div:nth-child(1) > div > table > tbody > tr.field_112

Justin - what value are you trying to retrieve from the calendar? I assume it's not the date value that's selected or you'd grab that from the date field directly.