Click counter

What code is needed to create a click counter by clicking on a button on one page and displaying the number on another please

Hi i can attach a screen shot no problem but can i clarify the following

DynamicDataset in your code is the dataset on the creator page i.e. the page that initiates the addition of a number (this function is attached to the dataset which is used to add a number to another element on another page from the dynamic page once it has been initiated) I have used dataset1 as this dataset is linked to a standalone collection and not dynamic collection, although i could add a new field (totalClicks) to the dynamic collection

totalClicks is the field ID in the collection

click0 (I think this is the text element that is used on the non-dynamic page, therefore should be on that page as code for the target i.e. wixLocation page and not the creator or initiate page?

and submitDataset is the ID of the button (in this case the button is actually an image)

Thanks
Adam

@deleteduser
i am lost, sorry. All of this code i have put on the dynamic page that creates the database entry

$w.onReady(() => {
$w(‘#dynamicDataset’).onReady( function () {
let currentItem = $w(“#dynamicDataset”).getCurrentItem().totalClicks;
currentItem ++;
$w(“#dynamicDataset”).setFieldValue(“totalClicks”, currentItem);
$w(‘#dynamicDataset’).save();
wixLocation.to($w(‘#dynamicDataset’).getCurrentItem().websiteBeingLinkedTo);
});
});
$w.onReady( function () {
$w(‘#addNumber’).value = 0;
$w(‘#dataset1’).setFieldValue(“totalClicks”, $w(‘#addNumber’).value)
});

where i have put #addnumber this is the ID of the image that is clicked to hopefully create the database entry (this might be what you called (Click0)

otherwise i do not get the userInput (Click0)

Thanks
Adam

also i added a field to the dynamic collection as totalClicks as a number type

Maybe i’ve given the wrong information?

page 1 - is a dynamic page that I intended to use an image (that is not connected to anything else) as the (button) to create the database entry into collection
so when a user clicks the image this
a) runs the code to update the database
b) redirects user to a new page

page 2 - has a text element that is linked to the field (now called totalClicks) to display the new click count

Thanks
Adam

@deleteduser Heath i’m really sorry but i’m lost on this one. Can you please look at my new comments based on page 1 (code to update the collection) and page 2 (any code needed if different from simply connecting the element) to help me understand better.

On my dynamic page i have a dynamic dataset which now has a field set as a number called totalClicks. The (button to send increase number count) is an image. Should this be a real Button?

The image (button) i have labelled in properties as #addNumber

Thanks for the hopefully perseverance with this one. I’m sure you must pull your hair out

Regards
Adam

@deleteduser ok so i’ve tried again a few times here is the code and the console

$w.onReady(() => {
$w(‘#dynamicDataset’).onReady( function () {
let currentItem = $w(“#dynamicDataset”).getCurrentItem().totalClicks;
currentItem ++;
$w(“#dynamicDataset”).setFieldValue(“totalClicks”, currentItem);
$w(‘#dynamicDataset’).save();
wixLocation.to($w(‘#dynamicDataset’).getCurrentItem().websiteBeingLinkedTo);
});
});
$w.onReady( function () {
$w(‘#addNumber’).value = 0;
$w(‘#dynamicDataset’).setFieldValue(“totalClicks”, $w(‘#addNumber’).value)
});

or this as trying to remove these errors

$w.onReady(() => {
$w(‘#dynamicDataset’).onReady( function () {
let currentItem = $w(“#dynamicDataset”).getCurrentItem().totalClicks;
currentItem ++;
$w(“#dynamicDataset”).setFieldValue(“totalClicks”, currentItem);
$w(‘#dynamicDataset’).save();
wixLocation.to($w(‘#dynamicDataset’).getCurrentItem().websiteBeingLinkedTo);
$w.onReady(() => {
$w(‘#addNumber’).value = 0;
$w(‘#dynamicDataset’).setFieldValue(“totalClicks”, $w(‘#addNumber’).value)
});
});
});

or

$w.onReady(() => {
$w(‘#dynamicDataset’).onReady( function () {
let currentItem = $w(“#dynamicDataset”).getCurrentItem().totalClicks;
currentItem ++;
$w(“#dynamicDataset”).setFieldValue(“totalClicks”, currentItem);
$w(‘#dynamicDataset’).save();
wixLocation.to(‘/home-1’)
$w.onReady(() => {
$w(‘#addNumber’).value = 0;
$w(‘#dynamicDataset’).setFieldValue(“totalClicks”, $w(‘#addNumber’).value)
});
});
});

import Wix Location is at the top of the page, to note so not an issue
If i use this code i just get redirected to homepage although this wasn’t the code you presented i have been experimenting

Thanks
Adam

hello Heath, are you there? can you help me from the beginning please?

Hi Heath, thanks for persevering with me.

The dynamic page is created when a user profile (name, location etc.) data is submitted on a user input form page.The user is then directed to their profile page and a dynamic page exists as a link from their profile page.

On the dynamic page which is owned by the logged in user, an image has been placed on their dynamic page and when clicked this should return a click count in a text field on their profile page. (actually the click counter receiver (text field for number) is actually within a repeater item.

The page redirect should take them to a different page before going back to profile page (this bit will be easy as i can add the correct page link for this) which will take the user through some actions before returning to their profile page and viewing the click counter update.

So does this helped make sense?

@deleteduser ok so i guess this code cannot be used by a guest visiting the dynamic page who clicks the counter image then which was the intention, unless i manually update every 0 in the total clicks field? I think that could be very difficult to manage

the only other thing to do, is have the click counter actually update on the same page, without anyone needing to be logged in. Is this possible?

I am smiling to myself now because i know this is more new code for me to try and understand. Is it pretty straight forward ? or if you were coding this would it be really difficult ?

and would this do a same page click counter update or the profile page ?either way i’ve got to try and get it working

@deleteduser ok so this code

$w.onReady(() => {
$w(‘#click0’).value = 0;
$w(‘#mySubmitDataset’).onReady(() => {
$w(‘#mySubmitDataset’).setFieldValue(“totalClicks”, $w(‘#click0’).value);

});
});

literally exists to setup the connection between pages for a click event at some point in the future and to be placed on profile setup form page

and this code goes on the dynamic page with the suppressAuth(). above $w(‘#dynamicDataset’).onReady(() => {

something like this?

import wixLocation from ‘wix-location’;
import wixData

$w.onReady(() => {

let options = {
“suppressAuth”: true,
“suppressHooks”: true
};
$w(‘#dynamicDataset’).onReady(() => {
let currentClicks = $w(‘#dynamicDataset’).getCurrentItem().totalClicks;
$w(‘#myButton’).onClick(() => {
currentClicks ++;
$w(‘#dynamicDataset’).setFieldValue(“totalClicks”, currentClicks);
$w(‘#dynamicDataset’).save();
wixLocation.to(‘/page2’);
});
});
});

So this makes sense to me. I have added this code to the creator page (which is the dynamic page)

(addNumber is the image that has onClick associated)
(totalClicks is the field in collection)

$w.onReady(() => {
$w(‘#dynamicDataset’).onReady(() => {
let currentClicks = $w(‘#dynamicDataset’).getCurrentItem().totalClicks;
$w(‘#addNumber’).onClick(() => {
currentClicks ++;
$w(‘#dynamicDataset’).setFieldValue(“totalClicks”, currentClicks);
$w(‘#dynamicDataset’).save();
[wixLocation.to(‘/page](wixLocation.to(’/page) ');
});
});
});

all good so far, i think.

Now this code below is supposed to go somewhere before the dynamic page. What is the purpose of this code please?

#click0 is described above in previous thread comment as user input - this is where i am really confused and lacking understanding???

How and where is the user supposed to input into click0? I’m trying to imagine what the user will need from me on this page and how i present a user input element for this code is run.

Do i add something like "if you would like to get the number of clicks from your dynamic page and display them on your profile page, then add a 0 in this user input field?

$w.onReady(() => { $w(’ #click0 ‘).value = 0; $w(’ #mySubmitDataset ‘).onReady(() => { $w(’ #mySubmitDataset ‘).setFieldValue(“totalClicks”, $w(’ #click0 ').value); }); });

sorry Heath and anyone else who sees this post, i’m really trying to understand thats all.

Thanks
Adam

I do have a let to insert section on the profile creation form page as follows, is this where i can insert the code somewhere to initiate the setup for click counter?

and if so can this code be tweaked to enable click value, setFieldValue?
$w.onReady(() => { $w(’ #click0 ‘).value = 0; $w(’ #mySubmitDataset ‘).onReady(() => { $w(’ #mySubmitDataset ‘).setFieldValue(“totalClicks”, $w(’ #click0 ').value); }); });

let toInsert = {
// consider also uploading the registered users ID or Email Address so that you can identify who uploaded the information
export function button21_click(event) {
“firstName”: $w(‘#input1’).value,
“middleName”: $w(‘#input9’).value,
“lastName”: $w(‘#input2’).value,

};
wixData.insert(“Member”, toInsert)

This is the code that i do not understand because i get parsing error on #click0 so what is #click0 supposed to be please?

I cannot get this code to read the snippet properly.

I have used a button and changed the property to #click0 and = 0; is not liked in the code
i know that “totalClicks” is the field key in the collection, so thats ok
#mySubmitDataset must be a button so i maybe this code can go into this

  1. let toInsert = {

  2. // consider also uploading the registered users ID or Email Address so that you can identify who uploaded the information

  3. export function button21_click(event) {

  4. “firstName”: $w(’ #input1 ').value,

  5. “middleName”: $w(’ #input9 ').value,

  6. “lastName”: $w(’ #input2 ').value,

  7. };

  8. wixData.insert(“Member”, toInsert)
    which is executed by an export function button?

Hi Heath, this is probably getting on your nerves now but i’d still really like your help please

so to summarise i think my problem is getting this to work properly on the page that creates the profile

I did post a couple of other comments above which might also help

Thanks
Adam

but what is click0 if set to hidden ?
i have added a text element and named it click0 which i can hide but i’m so lost as the code has parsing errors because of what i’ve done

ok i’ve done that, there’s progress :slight_smile:
so now i’m getting
Script error. in the console when i click on the image to create the increment in total clicks

so i have put a button over the image for the onClick and still get script error. This code is on the page where the image is

$w.onReady(() => {
$w(‘#dynamicDataset’).onReady(() => {
let currentClicks = $w(‘#dynamicDataset’).getCurrentItem().totalClicks;
$w(‘#button38’).onClick(() => {
currentClicks ++;
$w(‘#dynamicDataset’).setFieldValue(“totalClicks”, currentClicks);
$w(‘#dynamicDataset’).save();
[wixLocation.to(‘/page](wixLocation.to(’/page) 2 ');
});
});
});

this code is on the page that creates the profile and doesn’t have any errors now

$w.onReady(() => {
$w(‘#click0’).value = 0;
$w(‘#dataset6’).onReady(() => {
$w(‘#dataset6’).setFieldValue(“totalClicks”, $w(‘#click0’).value);
});
});