How can I clear the current page (user input and a table) and display a new form?

Ask the community
,
5

Try this one…

import wixData from 'wix-data';
import wixWindow from 'wix-window';  // for console output
// import wixLocation from 'wix-location'; 


$w.onReady(function () {
    $w("#table1").columns = [
        {"id": "col1","dataPath": "lakeAddress",    "label": "Lake Address","visible": true, "type": "stringfield2"},
        {"id": "Col2", "dataPath": "parcelNumber",  "label":"Parcel #","visible": true,      "type": "string"},
        {"id": "Col3", "dataPath":"name",           "label": "Name","visible": true,         "type": "string"},
        {"id": "Col4", "dataPath":"mailAddress",    "label": "Mail Address","visible": true, "type": "string"},
        {"id": "Col5", "dataPath":"city",           "label": "city","visible": true,         "type": "string"},
        {"id": "Col6", "dataPath":"state",          "label": "state","visible": true,        "type": "string"},
        {"id": "Col7", "dataPath":"zip",            "label": "zip","visible": true,          "type": "string"} 
    ];

    $w('#Submit').onClick ((event)=> {
        wixData.query("HLAGIS")
        .contains("lakeAddress",$w('#searchBox').value)
        .find()
        .then(result => {
            console.log("Submitclick event", result);
            $w("#table1").rows = result.items;
            $w("#table1").expand();
            $w("#table1").show('fade');
    })
 
    $w("#table1").onRowSelect(async(row_choosen) => {
 let rowData = await row_choosen.rowData; 
 let rowIndex = await row_choosen.rowIndex;  
 //----------------------------------
        console.log("rowData is ",rowData); 
        console.log("RowIndex is ",rowIndex);   
        console.log(rowData.lakeAddress)
        console.log(rowData.parcelNumber)
        console.log(rowData.name)
        console.log(rowData.mailAddress)
        console.log(rowData.city)
        console.log(rowData.state)
        console.log(rowData.zip)
 //----------------------------------
 
        .then(async() => {
 await $w("#table1").hide('fade'),       $w("#table1").collapse() 
 await $w("#searchBox").hide('fade'),    $w("#searchBox").collapse()
 await $w("#searchButton").hide('fade'), $w("#searchButton").collapse()
 //----------------------------------
        })
    })
})