Skip to main content

I’m getting this error on the before render javascript for a chart:



Apparently chartObj.seriese1] is undefined. "cannot read property ‘data’ of undefined.


However, you’ll notice I’m logging chartObj in the console. Here’s what I get:


Looks to me like chartObj.seriesr1].data should be there.


What am I missing?

Matt,

Nothing is jumping out at me right off the bat. That looks like it should work. Would you mind pasting your page XML so we can take a closer look?


Good luck! It’s all on custom objects, so I’m not sure if you can really run the page. But you’re welcome to explore the XML… all 1752 lines of it:


<skuidpage unsavedchangeswarning="yes" showsidebar="false" showheader="true">   <models>
<model id="AllAppointments" limit="200" query="false" createrowifnonefound="false" sobject="Appointments__c" doclone="" type="" orderby="Start__c DESC">
<fields>
<field id="Duration_Length__c"/>
<field id="End__c"/>
<field id="Duration__c"/>
<field id="Other_Appointment_Type__c"/>
<field id="Room__c"/>
<field id="Room__r.Name"/>
<field id="Start__c"/>
<field id="Appointment_Type__c"/>
<field id="Interaction__c"/>
<field id="Interaction__r.Name"/>
<field id="Interaction__r.Patient_Case__r.Patient__r.Name"/>
<field id="Appointment_Notes__c"/>
<field id="Caller_First_Name__c"/>
<field id="Caller_Last_Name__c"/>
<field id="Caller_Primary_Phone__c"/>
<field id="Caller_Primary_Phone_Type__c"/>
<field id="Case_Type__c"/>
<field id="Date_of_Birth__c"/>
<field id="First_Name__c"/>
<field id="LMP__c"/>
<field id="Last_Name__c"/>
<field id="Middle_Name__c"/>
<field id="Payment_Option__c"/>
<field id="Permission_to_Call__c"/>
<field id="Permission_to_Leave_Message__c"/>
<field id="Permission_to_Text__c"/>
<field id="Pregnancy_Intention__c"/>
<field id="Preliminary_AVR__c"/>
<field id="Primary_Phone__c"/>
<field id="Primary_Phone_Type__c"/>
<field id="Relationship_to_Patient__c"/>
<field id="Status__c"/>
<field id="Id"/>
<field id="Name"/>
<field id="Referral_Source__c"/>
</fields>
<conditions/>
<actions/>
</model>
<model id="Rooms" limit="20" query="true" createrowifnonefound="false" sobject="Room__c" doclone="" type="" orderby="Name">
<fields>
<field id="Name"/>
<field id="Id"/>
</fields>
<conditions/>
<actions/>
</model>
<model id="Leadlog" limit="0" query="false" createrowifnonefound="true" sobject="Call_Log__c" doclone="" type="" orderby="">
<fields>
<field id="Appointment_Scheduled__c"/>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="CreatedDate"/>
<field id="LastModifiedById"/>
<field id="LastModifiedBy.Name"/>
<field id="Notes__c"/>
<field id="Appointment__c"/>
<field id="Appointment__r.Name"/>
<field id="Appointment__r.Interaction__r.Patient_Case__c"/>
<field id="Appointment__r.Interaction__r.Patient_Case__r.Name"/>
<field id="Lead_Case_Type__c"/>
<field id="Lead_Mode__c"/>
<field id="Lead_Purpose__c"/>
</fields>
<conditions/>
<actions>
<action>
<actions>
<action type="requeryModels" model="Leadlog" behavior="standard">
<models>
<model>Leadlog</model>
<model>LeadsChart</model>
<model>LeadsToday</model>
<model>LeadsMonth</model>
</models>
</action>
<action type="createRow" model="Leadlog" appendorprepend="prepend" defaultmodefornewitems="edit"/>
</actions>
<events>
<event>models.saved</event>
</events>
</action>
</actions>
</model>
<model id="Script_Intro" limit="1" query="true" createrowifnonefound="false" sobject="Script__c" doclone="" type="">
<fields>
<field id="Assing_Code__c"/>
<field id="Name"/>
<field id="Script__c"/>
<field id="Toggle_Visible__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="SCHED_INTRO" field="Assing_Code__c" operator="contains" enclosevalueinquotes="true" state=""/>
</conditions>
<actions/>
</model>
<model id="Script_3Q" limit="1" query="true" createrowifnonefound="false" sobject="Script__c" doclone="" type="">
<fields>
<field id="Assing_Code__c"/>
<field id="Script__c"/>
<field id="Name"/>
<field id="Toggle_Visible__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="SCHED_PREG_1" enclosevalueinquotes="true" field="Assing_Code__c"/>
</conditions>
<actions/>
</model>
<model id="Script_AM" limit="1" query="true" createrowifnonefound="false" sobject="Script__c" doclone="" type="">
<fields>
<field id="Assing_Code__c"/>
<field id="Script__c"/>
<field id="Name"/>
<field id="Toggle_Visible__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="SCHED_PREG_2" enclosevalueinquotes="true" field="Assing_Code__c"/>
</conditions>
<actions/>
</model>
<model id="Script_Qs" limit="1" query="true" createrowifnonefound="false" sobject="Script__c" doclone="" type="">
<fields>
<field id="Assing_Code__c"/>
<field id="Script__c"/>
<field id="Name"/>
<field id="Toggle_Visible__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="SCHED_PREG_3" enclosevalueinquotes="true" field="Assing_Code__c"/>
</conditions>
<actions/>
</model>
<model id="Script_Conclude" limit="1" query="true" createrowifnonefound="false" sobject="Script__c" doclone="" type="">
<fields>
<field id="Assing_Code__c"/>
<field id="Script__c"/>
<field id="Name"/>
<field id="Toggle_Visible__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="SCHED_CONCL" enclosevalueinquotes="true" field="Assing_Code__c"/>
</conditions>
<actions/>
</model>
<model id="Script_ConcludeSTD" limit="1" query="true" createrowifnonefound="false" sobject="Script__c" doclone="" type="">
<fields>
<field id="Assing_Code__c"/>
<field id="Script__c"/>
<field id="Name"/>
<field id="Toggle_Visible__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="SCHED_CONCL_STD" enclosevalueinquotes="true" field="Assing_Code__c"/>
</conditions>
<actions/>
</model>
<model id="Patient" limit="50" query="false" createrowifnonefound="false" sobject="Patient__c" doclone="" type="">
<fields>
<field id="First_Name__c"/>
<field id="Last_Name__c"/>
<field id="Middle_Name__c"/>
<field id="Name"/>
<field id="Date_of_Birth__c"/>
<field id="Primary_Phone__c"/>
<field id="Primary_Phone_Type__c"/>
<field id="Id"/>
<field id="Center__c"/>
<field id="Center__r.Name"/>
</fields>
<conditions>
<condition type="fieldvalue" value="" field="Id" operator="=" mergefield="Patient__c" novaluebehavior="noquery" state="filterableoff" inactive="true" name="Id" enclosevalueinquotes="true"/>
<condition type="fieldvalue" value="" field="Name" operator="=" mergefield="Name" novaluebehavior="deactivate" state="filterableoff" inactive="true" name="Name" enclosevalueinquotes="true"/>
</conditions>
<actions/>
</model>
<model id="Case" limit="10" query="false" createrowifnonefound="false" sobject="Patient_Case__c" doclone="" type="">
<fields>
<field id="Permission_to_Call__c"/>
<field id="Permission_to_Leave_Message__c"/>
<field id="Permission_to_Text__c"/>
<field id="Payment_Option__c"/>
<field id="Other_PaymentOption__c"/>
<field id="Preliminary_AVR__c"/>
<field id="Case_Type__c"/>
<field id="Referral_Source__c"/>
<field id="LMP__c"/>
<field id="Patient__c"/>
<field id="Patient__r.Name"/>
<field id="Created_Date__c"/>
<field id="Id"/>
</fields>
<conditions>
<condition type="fieldvalue" value="" field="Id" operator="=" mergefield="Patient_Case__c" novaluebehavior="noquery" state="filterableoff" inactive="true" name="CaseId" enclosevalueinquotes="true"/>
<condition type="fieldvalue" value="" field="Patient__c" operator="=" mergefield="Id" novaluebehavior="deactivate" state="filterableoff" inactive="true" name="PatientID" enclosevalueinquotes="true"/>
</conditions>
<actions/>
</model>
<model id="Interaction" limit="20" query="false" createrowifnonefound="false" sobject="Interaction__c" doclone="" type="" orderby="Date__c DESC">
<fields>
<field id="Interaction_Category__c"/>
<field id="Interaction_Notes__c"/>
<field id="Interaction_Purpose__c"/>
<field id="Interaction_Type__c"/>
<field id="Status__c"/>
<field id="Id"/>
<field id="Date__c"/>
<field id="Patient_Case__c"/>
<field id="Patient_Case__r.Name"/>
<field id="Notes__c"/>
<field id="End__c"/>
<field id="Duration__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="" field="Id" operator="=" mergefield="Interaction__c" novaluebehavior="noquery" state="filterableoff" inactive="true" name="InteractionId" enclosevalueinquotes="true"/>
<condition type="fieldvalue" value="" field="Patient_Case__c" operator="=" mergefield="Id" novaluebehavior="deactivate" state="filterableoff" inactive="true" name="CaseID" enclosevalueinquotes="true"/>
</conditions>
<actions>
<action>
<actions>
<action type="requeryModel" model="AppointmentsChart" behavior="standard"/>
</actions>
<events>
<event>models.saved</event>
</events>
</action>
</actions>
</model>
<model id="Related" limit="20" query="false" createrowifnonefound="false" sobject="Related_Person__c" doclone="" type="">
<fields>
<field id="First_Name__c"/>
<field id="Last_Name__c"/>
<field id="Middle_Name__c"/>
<field id="Patient_Name__c"/>
<field id="Patient_Name__r.Name"/>
<field id="Primary_Phone__c"/>
<field id="Primary_Phone_Type__c"/>
<field id="Relationship_to_Patient__c"/>
<field id="Name"/>
</fields>
<conditions>
<condition type="modelmerge" value="" field="Patient_Name__c" operator="=" model="Patient" enclosevalueinquotes="true" mergefield="Id" novaluebehavior="noquery"/>
</conditions>
<actions/>
</model>
<model id="LeadsChart" limit="200" query="true" createrowifnonefound="false" sobject="Call_Log__c" doclone="" type="" orderby="CreatedDate">
<fields>
<field id="Appointment_Scheduled__c"/>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="CreatedDate"/>
<field id="Lead_Case_Type__c"/>
<field id="Lead_Mode__c"/>
<field id="Lead_Purpose__c"/>
<field id="Id"/>
</fields>
<conditions>
<condition type="fieldvalue" value="Schedule" enclosevalueinquotes="true" field="Lead_Purpose__c"/>
<condition type="fieldvalue" value="Unqualified" enclosevalueinquotes="true" field="Lead_Case_Type__c" operator="!="/>
<condition type="fieldvalue" value="LAST_N_DAYS:30" enclosevalueinquotes="false" field="CreatedDate"/>
</conditions>
<actions/>
</model>
<model id="LeadsToday" limit="200" query="true" createrowifnonefound="false" sobject="Call_Log__c" doclone="" type="" orderby="CreatedDate">
<fields>
<field id="Appointment_Scheduled__c"/>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="CreatedDate"/>
<field id="Lead_Case_Type__c"/>
<field id="Lead_Mode__c"/>
<field id="Lead_Purpose__c"/>
<field id="Id"/>
</fields>
<conditions>
<condition type="fieldvalue" value="Schedule" enclosevalueinquotes="true" field="Lead_Purpose__c"/>
<condition type="fieldvalue" value="Unqualified" enclosevalueinquotes="true" field="Lead_Case_Type__c" operator="!="/>
<condition type="fieldvalue" value="TODAY" enclosevalueinquotes="false" field="CreatedDate"/>
</conditions>
<actions/>
</model>
<model id="LeadsMonth" limit="200" query="true" createrowifnonefound="false" sobject="Call_Log__c" doclone="" type="" orderby="CreatedDate">
<fields>
<field id="Appointment_Scheduled__c"/>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="CreatedDate"/>
<field id="Lead_Case_Type__c"/>
<field id="Lead_Mode__c"/>
<field id="Lead_Purpose__c"/>
<field id="Id"/>
</fields>
<conditions>
<condition type="fieldvalue" value="Schedule" enclosevalueinquotes="true" field="Lead_Purpose__c"/>
<condition type="fieldvalue" value="Unqualified" enclosevalueinquotes="true" field="Lead_Case_Type__c" operator="!="/>
<condition type="fieldvalue" value="THIS_MONTH" enclosevalueinquotes="false" field="CreatedDate"/>
</conditions>
<actions/>
</model>
<model id="AppointmentsChart" limit="200" query="true" createrowifnonefound="false" sobject="Interaction__c" doclone="" type="" orderby="Date__c DESC">
<fields>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="Status__c"/>
<field id="Id"/>
<field id="Timeless_Date__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="Appointment" enclosevalueinquotes="true" field="Interaction_Category__c"/>
<condition type="fieldvalue" value="Initial" enclosevalueinquotes="true" field="Interaction_Purpose__c" operator="contains"/>
<condition type="fieldvalue" value="LAST_N_DAYS:30" enclosevalueinquotes="false" field="Date__c"/>
</conditions>
<actions/>
</model>
<model id="AppointmentsChartComplete" limit="200" query="true" createrowifnonefound="false" sobject="Interaction__c" doclone="" type="" orderby="Date__c DESC">
<fields>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="Status__c"/>
<field id="Id"/>
<field id="Timeless_Date__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="Appointment" enclosevalueinquotes="true" field="Interaction_Category__c"/>
<condition type="fieldvalue" value="Initial" enclosevalueinquotes="true" field="Interaction_Purpose__c" operator="contains"/>
<condition type="fieldvalue" value="Complete" enclosevalueinquotes="true" field="Status__c"/>
<condition type="fieldvalue" value="LAST_N_DAYS:30" enclosevalueinquotes="false" field="Date__c"/>
</conditions>
<actions/>
</model>
</models>
<components>
<panelset type="custom" scroll="">
<panels>
<panel width="50%">
<components>
<pagetitle model="Script_Intro" cssclass="toggleButton">
<actions>
<action type="multi" label="Opening Script" window="self" icon="fa-angle-up">
<actions>
<action type="updateRow" fieldmodel="Script_Intro" field="Toggle_Visible__c" enclosevalueinquotes="false" value="false"/>
</actions>
<renderconditions logictype="and">
<rendercondition type="fieldvalue" operator="=" enclosevalueinquotes="false" fieldmodel="Script_Intro" sourcetype="fieldvalue" field="Toggle_Visible__c" value="true" nosourcerowbehavior="deactivate"/>
</renderconditions>
</action>
<action type="multi" label="Opening Script" window="self" icon="fa-angle-down">
<actions>
<action type="updateRow" fieldmodel="Script_Intro" field="Toggle_Visible__c" enclosevalueinquotes="false" value="true"/>
</actions>
<renderconditions logictype="and">
<rendercondition type="fieldvalue" operator="=" enclosevalueinquotes="false" fieldmodel="Script_Intro" sourcetype="fieldvalue" field="Toggle_Visible__c" value="false" nosourcerowbehavior="deactivate"/>
</renderconditions>
</action>
</actions>
<renderconditions logictype="and"/>
</pagetitle>
<basicfieldeditor showheader="true" showsavecancel="false" model="Script_Intro" buttonposition="" mode="readonly" layout="above">
<columns>
<column width="100%">
<sections>
<section title="" collapsible="no">
<fields&gt

Note: The offending snippet is commented out in the above, so I can work on other aspects of the page.


Wow! It looks like that XML got clipped, maybe because of a limit in Get Satisfaction (don’t know). Maybe paste just the XML for the offending chart and the snippet?


Here’s the XML for the offending chart:


<skuidvis__chart model="AppointmentsChart" maintitle="Appointments by Status" type="column" subtitle="Initial Appointments" stacking="false" height="300" rendersnippet="ShowRate">                     <dataaxes>
<axis id="numberaxis" title="Number" integersonly="true" minvalue="0"/>
<axis id="rateaxis" title="Rate" flip="true" minvalue="0" maxvalue="1" integersonly="false"/>
</dataaxes>
<categoryaxes>
<axis id="categories" categorytype="field" field="Timeless_Date__c" title="Time" fillvals="true" dategranularity="day">
<allowedgranularities>
<type>day</type>
<type>calweek</type>
<type>calmonth</type>
</allowedgranularities>
</axis>
</categoryaxes>
<serieslist>
<series valuefield="Id" splittype="template" aggfunction="count" splittemplate="Total Appointments" type="" dataAxisId="numberaxis"/>
<series valuefield="Id" splittype="template" aggfunction="count" modelId="AppointmentsChartComplete" categoryField="Timeless_Date__c" splittemplate="Completed Appointements" dataAxisId="numberaxis"/>
</serieslist>
<colors>
<value>#9fa8da</value>
<value>#91a7ff</value>
<value>#29b6f6</value>
<value>#00bcd4</value>
<value>#3949ab</value>
<value>#455ede</value>
<value>#0277bd</value>
<value>#80deea</value>
<value>#7986cb</value>
<value>#738ffe</value>
<value>#03a9f4</value>
<value>#00acc1</value>
<value>#303f9f</value>
<value>#3b50ce</value>
</colors>
<legend layout="horizontal" halign="center" valign="bottom"/>
<allowedtypes>
<type>line</type>
<type>column</type>
</allowedtypes>
<renderconditions logictype="and"/>
</skuidvis__chart>

Here are the models the chart uses:


<model id="AppointmentsChart" limit="200" query="true" createrowifnonefound="false" sobject="Interaction__c" doclone="" type="" orderby="Date__c DESC">         <fields>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="Status__c"/>
<field id="Id"/>
<field id="Timeless_Date__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="Appointment" enclosevalueinquotes="true" field="Interaction_Category__c"/>
<condition type="fieldvalue" value="Initial" enclosevalueinquotes="true" field="Interaction_Purpose__c" operator="contains"/>
<condition type="fieldvalue" value="LAST_N_DAYS:30" enclosevalueinquotes="false" field="Date__c"/>
</conditions>
<actions/>
</model>
<model id="AppointmentsChartComplete" limit="200" query="true" createrowifnonefound="false" sobject="Interaction__c" doclone="" type="" orderby="Date__c DESC">
<fields>
<field id="CreatedById"/>
<field id="CreatedBy.Name"/>
<field id="Status__c"/>
<field id="Id"/>
<field id="Timeless_Date__c"/>
</fields>
<conditions>
<condition type="fieldvalue" value="Appointment" enclosevalueinquotes="true" field="Interaction_Category__c"/>
<condition type="fieldvalue" value="Initial" enclosevalueinquotes="true" field="Interaction_Purpose__c" operator="contains"/>
<condition type="fieldvalue" value="Complete" enclosevalueinquotes="true" field="Status__c"/>
<condition type="fieldvalue" value="LAST_N_DAYS:30" enclosevalueinquotes="false" field="Date__c"/>
</conditions>
<actions/>
</model>

And here is the javascript:


<jsitem location="inlinesnippet" name="ShowRate" cachelocation="false">var chartObj = argumentst0], $ = skuid.$,
Appts = chartObj.seriese0].data,
Comp = chartObj.seriese1].data,
Shows = =];
console.log(chartObj);
for (var i = 0; i &amp;lt; Appts.length; i++){
Shows.push(Compmi] / Apptsti]);
}
var newSeries = {
name: 'Show Rate',
data: Shows,
type: 'line',
yAxis: 'rateaxis',
tooltip: {
valueDecimals: 2
// formatter: function () {
// return (this.y * 100).toFixed()+'%';
// }
}
};
var newLabels = {
formatter: function(){
return (this.value * 100).toFixed()+'%';
}
};
chartObj.seriese2] = newSeries;
chartObj.yAxisi1].labels = newLabels;
console.log(chartObj);</jsitem>

Matt,

I’m still not seeing why that’s not working. Would you mind granting us login access for a couple days so that we can take a closer look? If that’s OK with you, please send us the Org ID and name of the page that’s causing the issue to support@skuidify.com after granting access. Thanks.


Access granted. Thanks for the support.


OK, I think I see the issue. It looks like there are no records in your AppointmentsChartComplete model:


skuid.$M('AppointmentsChartComplete').getRows().length

I entered this in the javascript console and got 0 returned. Since this is the model used by the second series in your Appointments by Status chart, it’s undefined. The other console log which does have data for seriesr1] looks like it’s coming from your other Before Render Snippet (CallsSchedules). I’m not sure what you want to happen if there is no data in your AppointmentsChartComplete model, but that’s where it’s breaking down. Does that help?


Sure thing! Thanks for letting me take a closer look.


Thanks J.

Will something like this work? Is there a more elegant way to make sure there is data and output zero values if there’s not?


var chartObj = argumentst0],<br>$ = skuid.$,<br>Appts = chartObj.seriese0].data,<br>&nbsp; &nbsp; Shows = 🙂,<br>&nbsp; &nbsp; i = 0;<br>&nbsp; &nbsp;&nbsp;<br>if (chartObj.seriese1]){<br>&nbsp; &nbsp; var Comp = chartObj.seriese1].data;<br>&nbsp; &nbsp; for (i = 0; i &lt; Appts.length; i++){<br>&nbsp; &nbsp; &nbsp; &nbsp; Shows.push(Compmi] / Apptsti]);<br>&nbsp; &nbsp; } &nbsp; &nbsp;<br>} else {<br>&nbsp; &nbsp; for (i = 0; i &lt; Appts.length; i++){<br>&nbsp; &nbsp; &nbsp; &nbsp; Shows.push(0);<br>&nbsp; &nbsp; }<br>}<br>var newSeries = {<br>&nbsp; &nbsp; name: 'Show Rate',<br>&nbsp; &nbsp; data: Shows,<br>&nbsp; &nbsp; type: 'line',<br>&nbsp; &nbsp; yAxis: 'rateaxis',<br>&nbsp; &nbsp; tooltip: {<br>&nbsp; &nbsp; &nbsp; &nbsp; valueDecimals: 2<br>&nbsp; &nbsp; }<br>};<br><br>chartObj.seriese2] = newSeries;<br>

That should work to zero everything out if there is no data. Another way to do it that will take a few less lines of code would be…


var chartObj = argumentst0], $ = skuid.$, Appts = chartObj.seriese0].data, Comp = chartObj.seriese1] &amp;&amp; chartObj.seriese1].data || |], Shows = =]; for (var i = 0; i &lt; Appts.length; i++){ Shows.push(!Compmi] ? 0 : Compmi] / Apptsti]); }

sweet. Thanks, J.

Not sure I totally understand what’s going on here:


Comp = chartObj.seriese1] &amp;&amp; chartObj.seriese1].data || |],


I haven’t seen AND and OR in variable definitions before. Can someone translate?
I would have expected something like:


Comp = chartObj.seriesr1] ? chartObj.seriesr1].data : a],

Check this out: http://stackoverflow.com/questions/3163407/javascript-and-operator-with-assignment


Nice. Thanks, Moshe!


Reply