Problem med "true" istället för det aktuella numret

2024-07-17, 20:43 #25

Medlem

Reg: Jul 2019

Inlägg: 527

Citat:

Ursprungligen postat av Finikanten

Nu har jag fixat så att samtliga bildramar ligger i samma container. Hur ska jag nu skriva i backend för att det ska bli en gemensam koppling till denna container? Jag påminner också om att varje bildram har ett eget fältnamn i databasen.

Mitt backend

Kod:

import wixData from 'wix-data';

export function Members_beforeUpdate(item, context) {
    if (item.likes) {
        return wixData.get(context.collectionName, item._id, { "suppressHooks": true })
       .then(itemToUpdate => {
        itemToUpdate.likes ? itemToUpdate.likes += 1 : itemToUpdate.likes = 1;

        return itemToUpdate;
 })
}
        return item;
}

Så här har jag skrivit i frontend enligt dina tidigare anvisningar men det är ju inte containern som ska klickas (vara OnClick) utan bildramarnas tomma hjärtan så därför förstår jag inte hur du menar och dessutom har varje bildram som sagt ett eget fält i databasen:

Kod:

export function Boxen_click(event) {
    const t = event.target;
        wixData.get("Members", memberId)
       .then((memberInfo) => {
    const clickedContainer = $w(t).closest('fullHeart1');
    const emptyHeart = clickedContainer.find('emptyHeart1');
          emptyHeart.collapse();

    const fullHeart = clickedContainer.find('fullHeart1');
          fullHeart.expand();

    const likes1 = clickedContainer.find('likes1');
          likes1.text = (parseInt(likes1.text, 10) + 1).toString();

          memberInfo.likes = true;
          wixData.update("Members", memberInfo).catch((error) => {
          console.error("Failed to update member info:", error);
 });
})
   .catch((error) => {
           console.error("Failed to get member info:", error);
 });
}

Vad tror du om att använda en repeater med alla bildramsgrupper istället för en container?

__________________
Senast redigerad av Finikanten 2024-07-17 kl. 20:59.

Citera

2024-07-17, 21:52 #26

Medlem

Reg: Jul 2005

Inlägg: 14 647

Citat:

Ursprungligen postat av Finikanten

Nu har jag fixat så att samtliga bildramar ligger i samma container. Hur ska jag nu skriva i backend för att det ska bli en gemensam koppling till denna container? Jag påminner också om att varje bildram har ett eget fältnamn i databasen.

Mitt backend

Kod:

import wixData from 'wix-data';

export function Members_beforeUpdate(item, context) {
    if (item.likes) {
        return wixData.get(context.collectionName, item._id, { "suppressHooks": true })
       .then(itemToUpdate => {
        itemToUpdate.likes ? itemToUpdate.likes += 1 : itemToUpdate.likes = 1;

        return itemToUpdate;
 })
}
        return item;
}

Med bildram menar du väl en bild på en användare, som hämtas ur databasen, tillsammans med vissa data om denne?
Sen har du flera bildramar, eftersom du vill att man ska kunna se flera medlemmar samtidigt.
Du skriver att varje bildram har ett eget "fält" i databasen.
Jag antar du menar att varje medlem (som fyller en viss bildram) har en egen rad i databasen, om du tänker dig databasen som en tabell.
När man skriver fält i databassammanhang brukar man avse en viss kolumn, t.ex. id, födelsedag eller namn.
Därför kanske du förstå att vi andra blir förvirrade när du skriver att varje bildram har sitt eget fält i databasen.
Men som sagt antar jag att du menar att varje bildram befolkas av ett urval data från en viss rad i databasen.

Återigen, jag vet inte om Wix har några egna abnormaliteter här, men utgångspunkten är att backend skiter fullständigt i hur dina data presenteras i frontend, ja - om du inte skapar själva sidan backend - alltså. Men så uppfattar jag inte att det är, utan du verkar ha en relativt statisk sida som du ändrar dynamiskt med data från backend, vilket hämtas från den sistnämnda genom web-anrop.

__________________
Senast redigerad av Enterprise 2024-07-17 kl. 22:16.

Citera

2024-07-17, 22:13 #27

Medlem

Reg: Jul 2005

Inlägg: 14 647

Citat:

Ursprungligen postat av Finikanten

Så här har jag skrivit i frontend enligt dina tidigare anvisningar men det är ju inte containern som ska klickas (vara OnClick) utan bildramarnas tomma hjärtan så därför förstår jag inte hur du menar och dessutom har varje bildram som sagt ett eget fält i databasen:

Kod:

export function Boxen_click(event) {
    const t = event.target;
        wixData.get("Members", memberId)
       .then((memberInfo) => {
    const clickedContainer = $w(t).closest('fullHeart1');
    const emptyHeart = clickedContainer.find('emptyHeart1');
          emptyHeart.collapse();

    const fullHeart = clickedContainer.find('fullHeart1');
          fullHeart.expand();

    const likes1 = clickedContainer.find('likes1');
          likes1.text = (parseInt(likes1.text, 10) + 1).toString();

          memberInfo.likes = true;
          wixData.update("Members", memberInfo).catch((error) => {
          console.error("Failed to update member info:", error);
 });
})
   .catch((error) => {
           console.error("Failed to get member info:", error);
 });
}

Vad tror du om att använda en repeater med alla bildramsgrupper istället för en container?

Det är mycket möjligt att en repeater är det bästa, så länge som du har kontroll på vilken knapp som gör vad. Testa får du se.

En repeater utesluter inte på något sätt en container. Anledningen till att jag föreslog en container var att du kan applicera OnClick-eventhandler på medlemmar i denna, utan att nödvändigtvis veta vilka id dessa har (eftersom du tydligen i Wix Online inte kan sätta in egna CSS-klasser vilket hade varit det enklaste)

Du utelämnar kod ovan nämligen den kod som applicerar OnClick-handlern på din container. Den kod som du skrev var enbart den kod som klick på containern kör. Det är rätt att klicken på containern inte ska trigga OnClick-funktionen utan denna ska appliceras på underliggande hjärtan (vilket element de nu har). Alltså, hur ser denna kod ut just nu?

Också: vilket element består hjärtanen av, som man ska kunna klicka på?
Detta behöver du veta för att kunna applicera OnClick-eventhandlern.
Som ett nödfall kan man tänka sig att applicera eventhandlern på alla element av den typ hjärtanen är som ligger under din container och sedan välja de element som har ett ID som börjar på ett visst sätt (utan att hårdkoda sex olika villkor så kan man filtrera ut alla element med id som börjar på likes)

Citera

2024-07-18, 00:34 #28

Medlem

Reg: Jul 2019

Inlägg: 527

Citat:

Ursprungligen postat av Enterprise

Med bildram menar du väl en bild på en användare, som hämtas ur databasen, tillsammans med vissa data om denne?
Sen har du flera bildramar, eftersom du vill att man ska kunna se flera medlemmar samtidigt.
Du skriver att varje bildram har ett eget "fält" i databasen.
Jag antar du menar att varje medlem (som fyller en viss bildram) har en egen rad i databasen, om du tänker dig databasen som en tabell.
När man skriver fält i databassammanhang brukar man avse en viss kolumn, t.ex. id, födelsedag eller namn.
Därför kanske du förstå att vi andra blir förvirrade när du skriver att varje bildram har sitt eget fält i databasen.
Men som sagt antar jag att du menar att varje bildram befolkas av ett urval data från en viss rad i databasen.

Återigen, jag vet inte om Wix har några egna abnormaliteter här, men utgångspunkten är att backend skiter fullständigt i hur dina data presenteras i frontend, ja - om du inte skapar själva sidan backend - alltså. Men så uppfattar jag inte att det är, utan du verkar ha en relativt statisk sida som du ändrar dynamiskt med data från backend, vilket hämtas från den sistnämnda genom web-anrop.

Ursäkta om jag inte har varit tillräckligt tydlig tidigare men så här är det upplagt:

Alla medlemmar har 6 "bildramar" var att ladda upp bilder till på sin profilsida. Med bildram menar jag en tom bildruta som kan fyllas med en bild av medlemmen och rutan har även en egen likesfunktion (ett klickbart hjärta) och denna funktion har ett eget fält i databasen (där totalnumret samlas för antal klickar den aktuella bilden har fått). Varje bildram och likesfunktion är samlat i en grupp av 6 som ligger i lager ovanpå varandra, det vill säga de 6 grupplagren är arrangerade ovanpå varandra. Detta för att det hela tiden bara är ett av grupplagren som är synligt för besökarna. När en ny bild klickas fram så innebär det att föregående bilds grupplager blir "collapsed" medan den nuvarande bildens grupplager blir "expanded". I databasen finns motsvarande 6 fält för uppladdade bilder och jämte dessa fält finns som sagt de 6 fälten för likesfunktionen (likes1, likes2, likes3 o s v). Eftersom sidan är dynamisk så hämtas bilderna från databasen utifrån vems sidadress det är fråga om (url-id) och visas för besökarna. Förstår du nu hur jag menar?

Citera

2024-07-18, 00:44 #29

Medlem

Reg: Jul 2019

Inlägg: 527

Den här förslagskoden skrev du ju på sida 1 i tråden och jag använde mig av den när jag skrev min egen version så jag förstår inte riktigt vad du menar med att jag utelämnar den kod som applicerar OnClick-handlern på min container?

Kod:

$w(".heart-container").onClick((event) => {
    const t = event.target;

    wixData.get("Members", memberId)
        .then((memberInfo) => {
            const clickedContainer = $w(t).closest('.heart-container');
            const emptyHeart = clickedContainer.find('.empty-heart');
            emptyHeart.collapse();

            const fullHeart = clickedContainer.find('.full-heart');
            fullHeart.expand();

            const textBox = clickedContainer.find('.likes-text');
            textBox.text = (parseInt(textBox.text, 10) + 1).toString();

            memberInfo.likes = true;
            wixData.update("Members", memberInfo).catch((error) => {
                console.error("Failed to update member info:", error);
            });
        })
        .catch((error) => {
            console.error("Failed to get member info:", error);
        });
});

Citera

2024-07-18, 09:08 #30

Medlem

Reg: Jul 2005

Inlägg: 14 647

Citat:

Ursprungligen postat av Finikanten

Alla medlemmar har 6 "bildramar" var att ladda upp bilder till på sin profilsida. Med bildram menar jag en tom bildruta som kan fyllas med en bild av medlemmen och rutan har även en egen likesfunktion (ett klickbart hjärta) och denna funktion har ett eget fält i databasen (där totalnumret samlas för antal klickar den aktuella bilden har fått). Varje bildram och likesfunktion är samlat i en grupp av 6 som ligger i lager ovanpå varandra, det vill säga de 6 grupplagren är arrangerade ovanpå varandra. Detta för att det hela tiden bara är ett av grupplagren som är synligt för besökarna. När en ny bild klickas fram så innebär det att föregående bilds grupplager blir "collapsed" medan den nuvarande bildens grupplager blir "expanded". I databasen finns motsvarande 6 fält för uppladdade bilder och jämte dessa fält finns som sagt de 6 fälten för likesfunktionen (likes1, likes2, likes3 o s v). Eftersom sidan är dynamisk så hämtas bilderna från databasen utifrån vems sidadress det är fråga om (url-id) och visas för besökarna. Förstår du nu hur jag menar?

OK, då förstår jag att varje bildram har ett eget likes-fält i databasen. Lite konstigt sätt att bygga det, men fine. Eftersom detta innebär att du i databasen har sex likesfält så bör ID-på hjärtrutorna vara kvar som likes1-likes6, vilket är fine.

Citat:

Ursprungligen postat av Finikanten

Den här förslagskoden skrev du ju på sida 1 i tråden och jag använde mig av den när jag skrev min egen version så jag förstår inte riktigt vad du menar med att jag utelämnar den kod som applicerar OnClick-handlern på min container?

Kod:

$w(".heart-container").onClick((event) => {

Det var bara ett exempel, dessutom kan du inte lägga till CSS-klasser så den koden fungerar inte.
Men hur (i HTML-form) ser bildramarna och hjärtrutorna ut just nu?
Jag ska ge ett exempel på hur jag menar.
Säg att containern har id "heart-container", att bildramarna ligger i en varsin div direkt under containern och att hjärtrutorna ligger i en underliggande div (under varje bildram) med klassen "clickable" (bara som ett exempel), då kan man applicera eventhandlern på alla hjärtrutor så här (detta är krångligare kod än vad som hade krävts i t.ex. jQuery, eftersom det är Wix - men, men)

Kod:

function heartClick(event)
{
   const id = event.target.id; // du har här namnet på det hjärta som klickats (t.ex. likes1)
   // här lägger du in din kod som ska köras front end när ett hjärta klickas
}

// lägg till onclick-handlers
$w("#heart-container").children("div").forEach(child => {
        child.children("div").forEach(subChild => {
            if (subChild.hasClass("clickable")) {
                subChild.onClick(heartClick);
            }
        });
    });

__________________
Senast redigerad av Enterprise 2024-07-18 kl. 09:40.

Citera

2024-07-18, 10:25 #31

Medlem

Reg: Jul 2019

Inlägg: 527

Citat:

Ursprungligen postat av Enterprise

OK, då förstår jag att varje bildram har ett eget likes-fält i databasen. Lite konstigt sätt att bygga det, men fine. Eftersom detta innebär att du i databasen har sex likesfält så bör ID-på hjärtrutorna vara kvar som likes1-likes6, vilket är fine.

Det var bara ett exempel, dessutom kan du inte lägga till CSS-klasser så den koden fungerar inte.
Men hur (i HTML-form) ser bildramarna och hjärtrutorna ut just nu?
Jag ska ge ett exempel på hur jag menar.
Säg att containern har id "heart-container", att bildramarna ligger i en varsin div direkt under containern och att hjärtrutorna ligger i en underliggande div (under varje bildram) med klassen "clickable" (bara som ett exempel), då kan man applicera eventhandlern på alla hjärtrutor så här (detta är krångligare kod än vad som hade krävts i t.ex. jQuery, eftersom det är Wix - men, men)

Kod:

function heartClick(event)
{
   const id = event.target.id; // du har här namnet på det hjärta som klickats (t.ex. likes1)
   // här lägger du in din kod som ska köras front end när ett hjärta klickas
}

// lägg till onclick-handlers
$w("#heart-container").children("div").forEach(child => {
        child.children("div").forEach(subChild => {
            if (subChild.hasClass("clickable")) {
                subChild.onClick(heartClick);
            }
        });
    });

Är detta menat att användas utan backend-kod?

Citera

2024-07-18, 10:30 #32

Medlem

Reg: Jul 2005

Inlägg: 14 647

Citat:

Ursprungligen postat av Finikanten

Är detta menat att användas utan backend-kod?

Nej, du måste ju kunna uppdatera databasen vid hjärtklick, vilket görs genom backend.

Citera

Problem med "true" istället för det aktuella numret

Skapa ett konto eller logga in för att kommentera

Skapa ett konto

Logga in