top of page

WIXデータベース 検索システム構築・・・③

​全件表示のプログラムコード

import wixData from 'wix-data';

 

let debounceTimer;

 

$w.onReady(function () {

 

    $w("#dataset1").onReady( () => {

        let count = $w("#dataset1").getTotalCount();

        $w("#totalText").text = 'Total: ' + count;

 

        $w("#companyRepeater").onItemReady( ($item, itemData, index) => {

            $item("#companyNameText").text = itemData.title;

            $item("#gyoText").text = itemData.kubun;

            $item("#areaText").text = itemData.area;

            $item("#naiyoText").text = itemData.Company_profile;

            $item("#companyImage").src = itemData.image01; 

            $item("#companyImage").tooltip = itemData.title; 

            $item("#companyImage").link = itemData.url;

        });

    });

 

});

 

let lastFilterName;

 

async function filter(title) { 

 

    if(lastFilterName !== title) {

        let newFilter = wixData.filter();

 

        if(title)

        newFilter = newFilter.contains('title', title);

        

        await $w("#dataset1").setFilter(newFilter);

        

        let count = $w("#dataset1").getTotalCount();

        $w("#totalText").text = 'Total: ' + count;

        setVariables(title);

     }

}

 

function setVariables(title) {

    lastFilterName = title;

 

}

​入力検索のプログラムコード

import wixData from 'wix-data';

 

let debounceTimer;

 

$w.onReady(function () {

 

    $w("#dataset1").onReady( () => {

        let count = $w("#dataset1").getTotalCount();

        $w("#totalText").text = 'Total: ' + count;

 

        $w("#companyRepeater").onItemReady( ($item, itemData, index) => {

            $item("#companyNameText").text = itemData.title;

            $item("#gyoText").text = itemData.kubun;

            $item("#areaText").text = itemData.area;

            $item("#naiyoText").text = itemData.Company_profile;

            $item("#companyImage").src = itemData.image01; 

            $item("#companyImage").tooltip = itemData.title; 

            $item("#companyImage").link = itemData.url;

        });

    });

 

    $w("#searchInput").onKeyPress( (event) => {

        if (debounceTimer) {

            clearTimeout(debounceTimer);

            debounceTimer = undefined;

        }

 

        debounceTimer = setTimeout(() => {

            filter($w("#searchInput").value);

        }, 350); 

    });

    

    $w("#refreshButton").onClick( (event) => {

        filter();

 

        $w("#searchInput").value = undefined;

    });

 

});

 

let lastFilterName;

 

async function filter(title) { 

 

    if(lastFilterName !== title) {

        let newFilter = wixData.filter();

 

        if(title)

        newFilter = newFilter.contains('title', title);

        

        await $w("#dataset1").setFilter(newFilter);

        

        let count = $w("#dataset1").getTotalCount();

        $w("#totalText").text = 'Total: ' + count;

        setVariables(title);

     }

}

 

function setVariables(title) {

    lastFilterName = title;

 

}

bottom of page