'Save changes' button

Ask the community
,
1

Hello guys:

So I´ve used the API to create a button that enables and disables a button when clicked. The thing now is that when I refresh the page, the button returns to “enabled”. So I think I could use a “Save button” where some authorized users could save those changes so those would be seen by every user.

Thanks,
Alvaro

2

Hi Alvaro,

At the button’s properties, you have the option to check or uncheck the field “Enabled by default”.

This filed determined the button’s status each time the page loads.

By unchecking the field, the button’s status will be “disabled”.

832×748 141 KB

In order to preserve the buttons’s enable status,

use the wix- storage to save a boolean variable that represent the desirable enable status.

At the $w.onReady( function () {} , get the variable’s value from the storage and change the buttons’s status

accordingly.

If you need help with your code we will be glad to assist you.
Have a nice day and best of luck!

3

Hi Alvaro,

If you would like to have the button save as “disabled” for only the current user, then you could use the wix-storage approach mentioned by Sapir.

If you would like to have a change made by one user then appear to an entirely different user, then you would want to save the changes in a Collection (i.e. in the WIX Database for your website), and read/query those values for each user of your website.

Below is code for Sapir’s approach:

import {session} from ‘wix-storage’;

$w.onReady(function () {

// this code is for when the page is reloaded or can go within any page on the website 
if(session.getItem("myButtonValue") === "disabled"){ 
    $w('#myButton').disable(); 
} 
else{ 
    $w('#myButton').enable(); 
}

})

export function myButton_click(event) {
session.setItem(“myButtonValue”, “disabled”); // called when user clicks the button to disable
}

To be able to share the change with other users, here is a general code example:

// PAGE 1 - CODE

import wixData from ‘wix-data’;
import wixUsers from ‘wix-users’;

export function btnSubmit_click(event) {
//Add your code for this event here:

let toInsert = { 
      "formValue1":  $w("#myButton").value, 
  "settingId":   "myButtonValue"	  
}; 

wixData.insert("SettingsValues", toInsert) 
	.then( (results) => { 
	    console.log("Form results submitted."); 
	} ) 
	.catch( (err) => { 
	    console.log(err); 
	} );

}

// PAGE 2 - CODE - FOR ALL OTHER MEMBERS TO SEE THE CHANGE

import wixData from ‘wix-data’;
import wixUsers from ‘wix-users’;

$w.onReady(function () {
loadData();
})

function loadData() {

wixData.query("SettingsValues") 
  .eq("settingId", "myButtonValue") 
  .find() 
  .then( (results) => { 
    let firstItem = results.items[0]; 	 

      if(firstItem.formValue1 === "disabled"){ 
    		$w('#myButton').disable(); 
	      } 
	      else{ 
    		$w('#myButton').enable(); 
	      } 

}) 
.catch( (err) => { 
	console.log(err);  
} );

}

Note that the above WIX Code assumes that the Collection name is “SettingsValues” and the fields of that Collection are named: “formValue1”, “settingId”. And, the following are the names of user input controls on both the member and non-member pages: $w(“#myButton”).

Hope this helps.

Nick

4

Hi there, I have a similar problem. I tried making a wix page with dropdown menus to choose time and task. But when I go into preview and select things myself, it doesn’t save when I reload the page or go on to a separate page. How do I add a “Save Changes” button to save user inputs in the dropdown menus? Thank you.

5

Please add your own post rather than bumping up an old thread from 2018.
Add any code used for this in a code block along with any screenshots that might help.

You do not need any save button, just use Wix Storage API to save the users choice and recall it and set the dropdown to that preset value when they go back to that page.
https://www.wix.com/corvid/reference/wix-storage.html