top of page

Forum Posts

Sam
Velo Team
Velo Team
Jul 02, 2020
In Tips, Tutorials, Examples
Need to write some code to perform a common task? Want to integrate with a 3rd party system? Why reinvent the wheel? There's a good chance someone else has already written the code you need. The npm registry contains more than a million JavaScript packages. Did you know that you can use npm packages in your site's frontend and backend code? To learn more about using npm packages, see Corvid: Working with npm Packages.
1
0
254
Sam
Velo Team
Velo Team
Jun 18, 2020
In Tips, Tutorials, Examples
When populating a repeater using code, a common issue that people experience is that when they update the repeater's data, what's displayed in the repeater is not updated automatically. To understand why this happens, you need to first understand how a repeater's elements get populated when you set it's data with code. You set a repeater's data using the data property. $w('#myRepeater').data = someDataArray; If that is all you do, the repeater does not know how you want to apply that data to the repeater's elements. That's why, before setting the data, you need to define an onItemReady event handler. For example, you might do something like this: $w("#myRepeater").onItemReady( ($item, itemData, index) => { $item("#repeatedImage").src = itemData.pic; $item("#repeatedText").text = itemData.words; }); What happens when you later reset the data property? $w('#myRepeater').data = someOtherDataArray; Well, it depends. If the new data contains new IDs, the onItemReady handler will run again and everything will work as expected. However, if you've just changed some of the data, but the IDs stay the same, nothing will happen. That's because the repeater only checks IDs when data is set. If an item's ID already exist in the repeater data, it is not considered a new item, and therefore the onItemReady handler does not run. So what do you do to update the repeater's elements with the new data? That's where the forEachItem comes in. You can run a function on each repeater item to populate it with the new data. So, using the same example as above, if you've updated the pictures in your data, you would code something like this: $w("#myRepeater").forEachItem( ($item, itemData, index) => { $item("#repeatedImage").src = itemData.pic; }); BTW - We're locking these posts so that any requests for help with Corvid can be maintained in the Community Discussion section. Please post your questions or feedback there.
7
0
3k
Sam
Velo Team
Velo Team
May 21, 2020
In Tips, Tutorials, Examples
Calling fetch() to access a 3rd-party API but it's not working? The most common problems people encounter when starting to work with fetch() are CORS issues. Not to worry. You can easily remedy the situation by making your fetch() call from the backend instead of the browser. Read more about this issue in Accessing Third-Party Services with the Fetch API. BTW - We're locking these posts so that any requests for help working with Corvid can be maintained in the Community Discussion section. Please post your questions or feedback there.
1
0
124
Sam
Velo Team
Velo Team
Oct 28, 2019
In Tips, Tutorials, Examples
We're excited to announce a new article that will help you improve the performance of your sites that use data. https://support.wix.com/en/article/corvid-improving-performance-in-sites-with-data As always, your feedback is greatly appreciated.
6
5
305
Sam
Velo Team
Velo Team
Mar 11, 2019
In News & Announcements
You've waited for it, now it will wait for you. The Job Scheduler allows you to schedule code to run at specified intervals. You schedule code to run by creating a job.  Each job defines what code to run and when to run it. The code your job runs can be any backend function. You can schedule that code to run on a daily, weekly, or monthly basis.  For example, you might create jobs that: Import data from an external source once a day. Delete collection data that is no longer relevant once a week. Send a status report to relevant parties once a month. How it works You configure what jobs to run and when to run them in a jobs.config file in your site's backend. The contents of the file look will look something like this: { "jobs": [ { // first job object "functionLocation": "/utils/dbUtils.js", "functionName": "deleteExpired", "description": "Delete expired DB items", "executionConfig": { "time": "22:00", "dayOfWeek": "Sunday" } }, { // another job object } ] } For more information, see Scheduling Recurring Jobs.
11
9
3k
Sam
Velo Team
Velo Team
Mar 11, 2019
In News & Announcements
The new mobile menu allows you to take elements from your site's header and footer and place them inside a menu box. This way you can create a mobile menu that is rich with content and design while saving valuable space in your mobile header and footer. You can hear more about the new mobile menu (and other new mobile features) in this round table discussion. To update your mobile menu to the new menu: Open the Editor > go to the Mobile Editor > select the menu > click settings > click Update Now > Click Get it Now To move elements from the header / footer to the menu box: Select element from the header/footer > right click > move to > move to menu box The new mobile menu also has two new API functions: open() close() With these functions, you can hide the built-in menu icon and make any element open and close the menu. See an example here.
Introducing the New Mobile Menu content media
4
11
1k
Sam
Velo Team
Velo Team
Jan 07, 2019
In News & Announcements
We are excited to announce the new Bookings API. Using the Bookings API you can create a custom booking experience for the services you offer on your site. For example, you can use the Bookings API to create a class schedule, where users first choose the day they want to take a class and are then presented with the classes that are available on that day. How does it work? The Bookings API consists of two functions that can be used in conjunction with the Bookings collections. API Functions: getServiceAvailability( ) - Use this function to find out which slots are still available for a service and then present those slots to your users. checkoutBooking( ) - Use this function once users have selected one of the available slots you presented to them. This function will book the selected service and process payments for the service if necessary. To learn more about the Bookings API, see the API Reference. Bookings Collections: Services - Information about the services you offer. Schedule - Information about each service's schedule. Staff - Information about your staff members. To learn more about the Bookings collections, see the Services, Schedule, and Staff articles. Learn More To learn how to use the Bookings API in a typical bookings flow, see Creating a Custom Bookings Experience. Keep an eye out for more articles and examples about the Bookings API coming soon.
2
1
1k
Sam
Velo Team
Velo Team
Jan 01, 2019
In Tips, Tutorials, Examples
We are excited to announce the following two additions to the wix-users-backend API. emailUser( ) The backend emailUser( ) function can be used to send a triggered email to any of your site's members. It works just like the frontend emailUser( ), without the restriction of only being able to send emails to the currently logged in user. To learn more, see emailUser( ) in the API reference. generateSessionToken( ) The generateSessionToken( ) function is used to bypass Wix member authentication so that you can use a 3rd party service to authenticate your users. That means you can provide Single Sign-On (SSO) for users where they are authenticated by a non-Wix entity to login to your Wix site. To learn more, see generateSessionToken( ) in the API reference.
2
12
1k
Sam
Velo Team
Velo Team
Dec 27, 2018
In Tips, Tutorials, Examples
We are excited to announce the addition of the General Info API. Using the General Info API, you can retrieve the information about your site from the General Info section of your site's Dashboard. For example, you can use the General Info API to create a custom footer that shows your business address, phone number, and schedule. How does it work? Import the Wix Site Backend API. Call the General Info API functions to retrieve the info you want. Example /**************** * Backend Code * ****************/ import wixSite from 'wix-site-backend'; export function getAddress() { return wixSite.generalInfo.getAddress(); } export function getPhone() { return wixSite.generalInfo.getPhone(); } /***************** * Frontend Code * *****************/ import {getAddress, getPhone} from 'backend/generalInfo'; // ... getAddress() .then( (address) => { $w("#street").text = address.street; $w("#city").text = address.city; $w("#state").text = address.state; } ); getPhone() .then( (phone) => { $w("#phone").text = wixSite.generalInfo.getPhone(); } ); Learn more To learn more, see generalInfo in the API reference.
6
1
620
Sam
Velo Team
Velo Team
Sep 02, 2018
In Tips, Tutorials, Examples
We're excited to announce that we've posted yet another Wix Stores article.
1
0
261
Sam
Velo Team
Velo Team
Jul 17, 2018
In Tips, Tutorials, Examples
Important: Your existing code will continue to work as it always has. No immediate action is required. What's going on? We're removing the $w parameter from event handlers. Event handlers will now only have an event parameter. For example, until now, when you added an onClick event handler to a button using the properties panel, the following code would be added to the code panel: export function myButton_click(event, $w) { //Add your code for this event here: } Now you will get the following code instead: export function myButton_click(event) { //Add your code for this event here: } If you have no idea why the $w parameter was there in the first place, you can safely skip the rest of this message. However, if you're now worried about how you're going to use event handlers with repeaters, please keep reading. How will I get a scoped selector? Until now, you'd use the $w parameter of an event handler to get a scoped selector. Events in repeaters are fired from an element in a repeater item. The $w parameter lets you select the specific instance of an element that is in the same repeater item as the element that fired the event. For example, here when a repeated image is clicked, the value of a text element in the same repeated item as the clicked image is changed to "Selected": export function myRepeatedImage_onClick(event, $w) { $w("#myRepeatedText").text = "Selected"; } Going forward, you'll use the $w.at() function to get a scoped selector. The function takes a context parameter that determines the scope of the selector you receive. You get the proper context from the event handler's event parameter. So, to mimic the above example, you will write the following code: export function myRepeatedImage_onClick(event) { let $item = $w.at(event.context); $item("#myRepeatedText").text = "Selected"; } Additionally, you can now get a scoped selector in dataset event handlers. For example, here when the dataset is about to save, a text element shows a message relaying that a save is occurring: export function dataset_beforeSave(event) { let $item = $w.at(event.context) $item("#statusText").value = "Saving..."; } What do I need to do so my code doesn't break? Nothing. That's right, your existing code will not break. We will continue supporting the old way of doing things, but we strongly encourage you to use the new syntax going forward. Also note that the code panel's autocompletion will no longer include the $w parameter in event handlers. When will this happen? You can start using the new syntax on August 1st.
3
5
9k
Sam
Velo Team
Velo Team
Jul 11, 2018
In Tips, Tutorials, Examples
Hey Wix Coders, As some of you may have noticed, when calling a function from a web module, if the function returns undefined or an object that includes a nested undefined value, the undefined values are recursively replaced with null. We’d like to align our protocol to the ECMAScript standards, which means replacing undefined with null only when necessary, since undefined and null are two different values in Javascript. For example, a function in a web module that until now returned the array [1, undefined, 2] will now return the array [1, null, 2]. However, a function in a web module that until now returned the object {a: 1, b: undefined}, which was received by the calling function as {a: 1, b: null}, will now return {a: 1}. You can safely ignore this message if your code does not include any strict equality comparisons (=== or !==) comparing a value returned from a web module function to null or undefined. This change might affect the behavior of your code if you use an explicit comparison to compare values returned from web module function calls to undefined or null. For example, if you have code that contains a condition similar to: if (returnedValue === null) Some cases that might have until now evaluated to true will now evaluate to false after this change goes into effect. The reason is that returnedValue may now be undefined instead of null. To avoid any breaking changes to your code, you can use abstract equality comparisons (== and !=), and compare the returned value to null: if (returnedValue == null) Here the boolean expression will evaluate to true when the returned value is either undefined or null. This change will be introduced on August 1st, 2018. For more information about the standards, see the Mozilla developers guide.
4
0
183
Sam
Velo Team
Velo Team
Nov 09, 2017
In Tips, Tutorials, Examples
The wix-dataset API has been updated so that we now enforce the passing of values for the fromIndex and numberOfItems parameters when calling the getItems() function. If you do not use the getItems() function in your code, or if you use it and pass values for the fromIndex and numberOfItems parameters as documented in the API Reference, you can safely ignore this message. If you have code that relied on the old behavior, where the getItems() function would return up to 1000 items if called without passing any parameters, you will need to update your code to pass values for the fromIndex and numberOfItems parameters. For example: // old code - WILL NO LONGER WORK! $w("myDataset").getItems() .then( (results) => { // do something with results } ); // new code - you need to change it to something like this const totalItems = $w("myDataset").getTotalCount(); $w("myDataset").getItems(0, totalItems) .then( (results) => { // do something with results } ); If you encounter any problems, please let us know here and we will do our best to help you.
1
11
2k
Sam
Velo Team
Velo Team
Sep 26, 2017
In Tips, Tutorials, Examples
We just added a new article demonstrating how to create a member profile page for each of the registered users of your site. https://support.wix.com/en/article/how-to-create-member-profile-pages We'd appreciate any feedback on whether or not you find the article helpful.
9
28
8k
Sam
Velo Team
Velo Team
Sep 25, 2017
In Tips, Tutorials, Examples
We just added two new articles about using the HTML Component with Wix Code. Working with the HTML Component in Developer Tools How to Create a Rich Text Editor using the HTML Component We'd appreciate any feedback you have on these articles.
3
1
239
Sam
Velo Team
Velo Team
Sep 24, 2017
In Tips, Tutorials, Examples
We just added a new article demonstrating how to create a popup that shows up only once for each visitor to your site. https://support.wix.com/en/article/how-to-create-a-one-time-popup We'd appreciate any feedback on whether or not the article helped you create a one-time popup on your site.
5
3
1k
Sam
Velo Team
Velo Team
Sep 17, 2017
In Tips, Tutorials, Examples
The wix-location API has been updated so that the path property returns only the path section of the page's URL. Previously it returned the prefix and the path sections of the page's URL. If you do not use the path property in your code, you can safely ignore this message. If you have code that relied on the path property also returning the URL's prefix, including the code from the How to Create Previous and Next Buttons for a Dynamic Item Page article, you will need to update your code to get the prefix information from the prefix property. For example: // old way const pathAndPrefix = wixLocation.path; // becomes const pathAndPrefix = wixLocation.prefix + '/' + wixLocation.path; The How to Create Previous and Next Buttons for a Dynamic Item Page article has been updated to reflect the change, but if you've already implemented the code from that article, you will need to change the code in your site yourself as follows. On the item page, the line: const currentPage = '/' + wixLocation.path.join('/'); needs to be changed to: const currentPage = '/' + wixLocation.prefix + '/' + wixLocation.path.join('/'); If you encounter any problems, please let us know here and we will do our best to help you.
0
0
227
Sam
Velo Team
Velo Team
Sep 17, 2017
In Tips, Tutorials, Examples
The wix-location API has been updated so that the path property returns only the path section of the page's URL. Previously it returned the prefix and the path sections of the page's URL. If you do not use the path property in your code, you can safely ignore this message. If you have code that relied on the path property also returning the URL's prefix, including the code from the How to Create Previous and Next Buttons for a Dynamic Item Page article, you will need to update your code to get the prefix information from the prefix property. For example: // old way const pathAndPrefix = wixLocation.path; // becomes const pathAndPrefix = wixLocation.prefix + '/' + wixLocation.path; The How to Create Previous and Next Buttons for a Dynamic Item Page article has been updated to reflect the change, but if you've already implemented the code from that article, you will need to change the code in your site yourself as follows. On the item page, the line: const currentPage = '/' + wixLocation.path.join('/'); needs to be changed to: const currentPage = '/' + wixLocation.prefix + '/' + wixLocation.path.join('/'); If you encounter any problems, please let us know here and we will do our best to help you.
1
0
459
Sam
Velo Team
Velo Team
Aug 16, 2017
In Tips, Tutorials, Examples
We just added a new article demonstrating how create previous and next buttons for a dynamic item page. https://support.wix.com/en/article/how-to-create-previous-and-next-buttons-for-a-dynamic-item-page We'd appreciate any feedback on whether or not the article helped you create previous and next buttons on your dynamic item pages.
4
8
2k
Sam
Velo Team
Velo Team
Aug 14, 2017
In Tips, Tutorials, Examples
We just added a new article demonstrating how to import and export collection data. https://support.wix.com/en/article/how-to-import-and-export-collection-data We'd appreciate any feedback on whether or not the article helped you import and export your collection data.
2
25
2k

Sam

Forum Moderator
Admin
Velo Team
+4
More actions
bottom of page