[solved] How to Use Code to Let Your Users Search a Collection

Ask the community
, ,
1

I followed the directions here: Velo Tutorial: Adding Collection Data Search Functionality | Help Center | Wix.com

to build this page here: https://braphox.wixsite.com/website/numberofpartslists-searchnumber-all
When I enter 6 the table should populate a 6 in column 2 and a 1 in column 3.
However, nothing happens.
Code for the page:
Note I did change lines 41 and 42 : from the guide lines 26 and 27.
]}); replaced the outline since it threw an unexpected symbol error.
Also, if anyone has thoughts on how to fill this table based on a calculated value stored in another table, how to retrieves said value; that would be fabulous.

import wixData from ‘wix-data’;
// For full API documentation, including code examples, visit Velo API Reference - Wix.com

$w.onReady( function () {
$w(“#table1”).columns = [
{
“id”: “col1”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “title”,
“label”: “Title”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “string”, // Data type for the column
// Path for the column if it contains a link
//“linkPath”: “link-field-or-property”
},
{
“id”: “col2”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “rpValue”,
“label”: “RPValue”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “Number”, // Data type for the column
// Path for the column if it contains a link
//“linkPath”: “link-field-or-property”
},
{
“id”: “col3”,
“dataPath”: “permutations”,
“label”: “Permutations”,
“width”: 100,
“visible”: true ,
“type”: “Number”,
//“linkPath”: “link-field-or-property”
} //,
// more column objects here if necessary
// …
// …
]});
export function search_click(event, $w) {
wixData.query(‘NumberOfPartslists’)
// Query the collection for any items whose “Name” field contains
// the value the user entered in the input element
.contains(‘rpValue’, $w(‘#input1’).value)
.find() // Run the query
.then(res => {
// Set the table data to be the results of the query
$w(‘#table1’).rows = res.items;
});
//Add your code for this event here:
}

2

Hello Charles,

In your collection, you have rpValue stored as a number and in your search you are comparing a number with a string which is why it is not returning anything.

To fix this change your search function from what you have to this:

export function search_click(event, $w) {
  wixData.query('NumberOfPartslists') 
  .eq('rpValue', parseInt($w('#input1').value)) // We use parseInt to turn string to integer
  .find()  
  .then(res => {     
    $w('#table2').rows = res.items; 
   });

Notice that I changed .contains to .eq, the reason for this is because a number can be 61 and the user inputs 6 and pulls all the rows that has the number 6 in it, I assume you want the exact number and in this case .eq is what you should use.

another change is the parseInt() wrapped around the input1.value which takes a string and parses it into an integer so you can compare it with the number type value in your collection.

Should be working perfectly after that.

Best,
Majd

3

Majd,

I did as suggested and it worked once.
Now in the code I receive a missing radix error on this line.
.eq(‘rpValue’, parseInt($w(’ #input1 ').value))

I did create a new page and redid the page. https://braphox.wixsite.com/website/parts

4

Also,
Is it possible to search based on the current “difference” value in UserRP database?

5

This is what I have done so far.

Start here: https://braphox.wixsite.com/website/enterrp
Enter two numbers such that the second number is 6, or 12, or, 13, or 16 more than the first number.
The difference is stored in UserRP in difference key.

Clicking the second button "Click to see Results: takes you here;
https://braphox.wixsite.com/website/parts

Clicking the search button should call the export function: and assign said difference number as item. Then when I query the NumberOfPartslists database I am comparing two numbers.
(
These lines in the code below:
export function search_click_1(event, $w) { wixData.get(“UserRP”,“differrence”) .then( (results) =>{ let item = results; })
)

My assumption is that I don’t have to parseInt since I am comparing numbers, and the table fills on SearchButton Click.

import wixData from ‘wix-data’;
// For full API documentation, including code examples, visit Velo API Reference - Wix.com

$w.onReady( function () {

$w(“#table1”).columns = [
{
“id”: “col1”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “title”,
“label”: “Title”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “string”, // Data type for the column
// Path for the column if it contains a link
//“linkPath”: “link-field-or-property”
},
{
“id”: “col2”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “rpValue”,
“label”: “RPValue”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “Number”, // Data type for the column
// Path for the column if it contains a link
//“linkPath”: “link-field-or-property”
},
{
“id”: “col3”,
“dataPath”: “permutations”,
“label”: “Permutations”,
“width”: 100,
“visible”: true ,
“type”: “Number”,
//“linkPath”: “link-field-or-property”
} //,
// more column objects here if necessary
// …
// …
]});
export function search_click_1(event, $w) {
wixData.get(“UserRP”,“differrence”)
.then( (results) =>{
let item = results;
})
. catch ( (err) => {
let errorMsg=err;
});
////<== changed from ; to , to test for change
wixData.query(‘NumberOfPartslists’)
.eq(‘rpValue’, ‘item’) // We use parseInt to turn string to integer
.find()
.then(res => {
$w(‘#table1’).rows = res.items;
});
//Add your code for this event here:
}

6

Also, I tried doing all of this on one page.

https://braphox.wixsite.com/website/copy-of-enterrp

But I am still getting a blank table.

// For full API documentation, including code examples, visit Velo API Reference - Wix.com
//TODO: write your code here…=RPGoal-CurrentRP
//export function switch1_click_1(event, $w)
//import {session} from ‘wix-storage’;
//session.setItem(“key”, “value”);

import wixData from ‘wix-data’;
$w.onReady( function () {

$w(“#table1”).columns = [{
“id”: “col1”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “title”,
“label”: “Title”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “string”, // Data type for the column
// Path for the column if it contains a link
//“linkPath”: “link-field-or-property”
},
{
“id”: “col2”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “rpValue”,
“label”: “RPValue”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “Number”, // Data type for the column
// Path for the column if it contains a link
//“linkPath”: “link-field-or-property”
},
{
“id”: “col3”,
“dataPath”: “permutations”,
“label”: “Permutations”,
“width”: 100,
“visible”: true ,
“type”: “Number”,
//“linkPath”: “link-field-or-property”
} //,
// more column objects here if necessary
// …
// …
]

$w(“#button2”).hide();
});

export function button1_click_1(event, $w) {
$w(“#button1”).hide();
$w(“#button2”).show();
let toInsert = {

“begin”: $w(“#input1”).value ,
“end”: $w(“#input2”).value,
“difference”: $w(“#input2”).value-$w(“#input1”).value,

};
wixData.insert(“UserRP”, toInsert)
.then( (results) => {
let item = results;
} )
. catch ( (err) => {
let errorMsg = err;
})
}

export function button2_click(event, $w) {
//Add your code for this event here:

        wixData.query('NumberOfPartslists') 

            .eq('rpValue', $w("dataset2").getCurrentItem()["difference"])  //<-- )attempting to get current number stored in UserRP, it is in the page as dataset 2 ) 
            .find() 
            .then(res => { 
                $w('#table1').rows = res.items; 
            });

}

7

From another resource. Calculate and store the calculated value as a number inside.

export function button2_click(event, $w) {
//Add your code for this event here:
let diff = Number($w(“#input2”).value)-Number($w(“#input1”).value) ← this part
wixData.query(‘NumberOfPartslists’)
.eq(‘rpValue’,diff)
.find()
.then(res => {
$w(‘#table1’).rows = res.items;
$w(“#table1”).show();
});

8

Hello Charles,

Did you manage to solve this?

9

Dear Majd, Yes I did. It turned out I needed to assign diff inside the function. I was thinking it was globally assigned. A misunderstanding on my part. However, I am still looking for a way to retrieve a single cell value from a content file. Example: I am working with permutations of numbers where order doesn’t matter and repetition is allowed. I have saved as content files the .csv files I uploaded.
I have attached a picture below of an extremely simplified example of two of the content files I work with.

What I can do is look up in Content file 1, the value 3 in the sum column and output to a table in my page the results: 3

What I have not figured out yet, is how to read Content file 2 and export just 1 value.
Example: I want to search Content file 2 for the sum of 3 and return the number of occurrences 2.
In one way, send it to a textbox in my page.
the second way, import it into the code and store it as a defined number in code (i.e. let occ = "the number 2 "the number of occurrences of the sum 3 in Content file 2.)

But, I am sure I will figure this out eventually.

1152×648 8.33 KB