When “Loading More” on a tab that has a new row added to it, a javascript exception “Uncaught Model ‘Contact’ has unsaved changes. To update this model’s data, you must first save or cancel the changes.” is encountered.
Based on the way skuid merges model data, etc. the exception isn’t the issue, instead, the Load More should be disabled after the new row was added. If you edit an existing record, Load More is properly disabled. It’s only after a new row has been added that the problem occurs.
Steps to Reproduce:
- Create page using xml below
- Preview page picking an account that has more than 1 contact
- Click the “plus” sign to add a new contact
- Click Load More
Expected Behavior
Load More is disabled and not “clickable”
Actual Behavior
Load More is triggered and javascript exception in console
Sample Page XML
<skuidpage unsavedchangeswarning="yes" personalizationmode="server" showsidebar="true" showheader="true" tabtooverride="Contact"> <models>
<model id="Contact" limit="1" query="true" createrowifnonefound="false" sobject="Contact" adapter="" type="">
<fields>
<field id="FirstName"/>
<field id="LastName"/>
<field id="CreatedDate"/>
</fields>
<conditions>
<condition type="param" value="acctid" field="AccountId" operator="=" enclosevalueinquotes="true" novaluebehavior=""/>
</conditions>
<actions/>
</model>
</models>
<components>
<pagetitle model="Contact" uniqueid="sk-3YrBrA-69">
<maintitle>
<template>{{Model.labelPlural}}</template>
</maintitle>
<subtitle>
<template>Home</template>
</subtitle>
<actions>
<action type="savecancel"/>
</actions>
</pagetitle>
<skootable showconditions="true" showsavecancel="false" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Contact" mode="read" uniqueid="sk-3YrBrA-70">
<fields>
<field id="FirstName" allowordering="true"/>
<field id="LastName" allowordering="true"/>
<field id="CreatedDate" allowordering="true"/>
</fields>
<rowactions>
<action type="edit"/>
<action type="delete"/>
</rowactions>
<massactions usefirstitemasdefault="true">
<action type="massupdate"/>
<action type="massdelete"/>
</massactions>
<views>
<view type="standard"/>
</views>
</skootable>
</components>
<resources>
<labels/>
<css/>
<javascript/>
</resources>
<styles>
<styleitem type="background" bgtype="none"/>
</styles>
</skuidpage>