Thanks! Yes, I am using form factor to distinguish the mobile and desktop code and am still stumped. Many other fields (including text boxes) behave correctly in mobile view, except for those on this particular page.
// For full API documentation, including code examples, visit Velo API Reference - Wix.com
import { session } from ‘wix-storage’ ;
import wixUsers from ‘wix-users’ ;
import wixData from ‘wix-data’ ;
import wixLocation from ‘wix-location’ ;
import wixWindow from ‘wix-window’ ;
//initiating initial values for six facets to be used for transferring data from free assessment to user info, where available
var initialValue1 = 5 , initialValue2 = 5 , initialValue3 = 5 , initialValue4 = 5 , initialValue5 = 5 , initialValue6 = 5 , AssessmentSource ;
$w . onReady ( function () {
//Step 0: Load dataset1 for USER_INFO collection to interact with
$w ( “#dataset1” ). onReady ( () => {
console . log ( “USER_INFO dataset 1 is ready to read from” );
} );
// Sense the windows form factor (desktop = sliders visible, boxes hidded (default) or mobile = sliders hiden, boxes visible)
if ( wixWindow . formFactor === “Mobile” ){
$w ( “#textBox12” ). show ()
$w ( “#textBox18” ). show ()
$w ( “#textBox24” ). show ()
//…
$w ( “#slider1” ). hide ()
$w ( “#slider7” ). hide ()
$w ( “#slider13” ). hide ()
// … } else {
$w ( “#textBox12” ). hide ()
$w ( “#textBox18” ). hide ()
$w ( “#textBox24” ). hide ()
//…
$w ( “#slider1” ). show ()
$w ( “#slider7” ). show ()
$w ( “#slider13” ). show ()
//…
}
//Step 1: Find the email address of current logged in user and set it to “SelectedUser”
let user = wixUsers . currentUser
let userId = user . id
user . getEmail ()
. then ( ( email ) => {
// $w(‘#textBox1’).value = email; // “user@something.com” - Display it in Input1 text box
let SelectedUser = email ;
// Step 2: Find if this email address exists in USER_INFO collection
return wixData . query ( ‘USER_INFO’ )
. eq ( “user_id_ref” , SelectedUser )
. find ()
. then ( ( results ) => {
// Step 3: If an item for the user is not found
if ( results . items . length === 0 ) {
// Step 3.1: Check if this userId has any data in Free Self Assessment. If it exists, assign the results to Initial Facet Values by picking earliest, most complete assessment
wixData . query ( ‘TR002_FREE_ASSESSMENT’ )
. eq ( “emailAddress” , SelectedUser )
. descending ( “completeness” )
. ascending ( “createdDate” )
. find ()
. then (( foundtheuser )=>{
if ( foundtheuser . items . length === 0 ){
//userId email not found in free assessment records
console . log ( “36 userID not found in free assessment records” )
}
else {
//userId email found in free assessment records. Select the oldest complete assessment record.
console . log ( “40 userID found in free assessment records” )
let foundvalue = foundtheuser . items [ 0 ]
initialValue1 = foundvalue . avgClb //Collaboration
initialValue2 = foundvalue . avgCmn //Communication
initialValue3 = foundvalue . avgInd //Indispensability
initialValue4 = foundvalue . avgLdr //Leadership
initialValue5 = foundvalue . avgOgz //Organized
initialValue6 = foundvalue . avgWlb //Work Life Balance
}
})
// Step 3.2: Create an item in USER_INFO with ID and Email of current user from PrivatreMembers Collection.
const toInsert = {
“_id” : userId ,
“user_id_ref” : SelectedUser ,
“facetOneInitialAssessment” : initialValue1 ,
“facetTwoInitialAssessment” : initialValue2 ,
“facetThreeInitialAssessment” : initialValue3 ,
“facetFourInitialAssessment” : initialValue4 ,
“facetFiveInitialAssessment” : initialValue5 ,
“facetSixInitialAssessment” : initialValue6 ,
};
// Step 3.2: Add the item to the collection. Note: All other fields will be left empty in the item
// and can be filled by connecting different input boxes to dataset as needed.
wixData . insert ( “USER_INFO” , toInsert )
. catch ( ( err ) => {
console . log ( err );
} );
}
else ( // Step 4: If the user already exists i.e. you find an item, then get and display user data for different sliders on this page
// $w(“#textBox2”).value=userId,
wixData . get ( “USER_INFO” , userId )
. then (( retrieved_results ) => {
if ( wixWindow . formFactor === “Desktop” ){
$w ( “#slider1” ). value = retrieved_results . facetOneInitialAssessment
$w ( “#slider7” ). value = retrieved_results . facetOneCurrentAssessment
$w ( “#slider13” ). value = retrieved_results . facetOneTarget
//…
} else
{
$w ( “#textBox12” ). value = retrieved_results . facetOneInitialAssessment . toString ()
$w ( “#textBox18” ). value = retrieved_results . facetOneCurrentAssessment . toString ()
$w ( “#textBox24” ). value = retrieved_results . facetOneTarget . toString ()
//…
}
) )
} )
})});
//Step 5: Once changes are made using input boxes, update the Collection “USER_INFO” for those changes only when the user clicks Submit button
export function SubmitPrivateData_click () {
let user = wixUsers . currentUser
let userId = user . id
console . log ( "Click function activated for: " , userId );
console . log ( "Slider position detected at: " , $w ( “#slider1” ). value );
//Step 0: Load dataset1 for USER_INFO collection to interact with
$w ( “#dataset1” ). onReady ( () => {
console . log ( “USER_INFO dataset 1 is ready to write to” );
} );
// Step 5.1: Get the relevant item from USER_INFO collection
wixData . get ( “USER_INFO” , userId )
. then ( ( item ) => {
console . log ( "Item secured for user: " , userId );
// Step 5.2: Update those fields in the retrieved item that are linked to the input boxes on this page
if ( wixWindow . formFactor === “Desktop” ){
item . facetOneInitialAssessment = $w ( “#slider1” ). value;
item . facetOneCurrentAssessment = $w ( “#slider7” ). value ;
item . facetOneTarget = $w ( “#slider13” ). value ;
//…
} else
{
item . facetOneInitialAssessment = parseInt ( $w ( “#textBox12” ). value );
item . facetOneCurrentAssessment = parseInt ( $w ( “#textBox18” ). value );
item . facetOneTarget = parseInt ( $w ( “#textBox24” ). value );
//…
}
//Step 5.3: Use update command to put values from input boxes back into USER_INFO collection
wixData . update ( “USER_INFO” , item );
//Step 5.4: Display success message
$w ( “#text34” ). show ();
$w ( “#text35” ). hide ();
} )
. catch ( ( err ) => {
let errorMsg = err ;
//Step 5.5: Display failure message
$w ( “#text35” ). show ();
$w ( “#text34” ). hide ();
console . log ( "Uh-oh, something went wrong while retrieving " , userId );
} )
console . log ( "onClick event not triggered for " , userId );
}
It’s hard to tell how you have it set up without seeing your code, but a suggestion I would make would be to split up the Desktop-only and Mobile-only code in your code using