The findRow() method of p5.Table in p5.js is used to find the first row that contains the given and value and returns a value to that row. The column that the method uses to search the row can be specified as a parameter. The method only returns the first row of the possible matches even if multiple matches exist.
Syntax:
findRow( value, column )
Parameters: This function accepts two parameters as mentioned above and described below:
- value: It is a String that specifies the value that has to be matched.
- column: It is a String or Number that denotes the column name or column ID of the column to be searched.
Below examples illustrate the findRow() method in p5.js:
Example 1:
function setup() {
createCanvas(500, 300);
textSize(16);
findQueryInput = createInput();
findQueryInput.position(30, 40);
getColBtn =
createButton( "Get the matching row" );
getColBtn.position(30, 70);
getColBtn.mouseClicked(getFindResults);
// Create the table
table = new p5.Table();
// Add two columns
table.addColumn( "name" );
table.addColumn( "age" );
// Add some rows to the table
let newRow = table.addRow();
newRow.setString( "name" , "Eren" );
newRow.setString( "age" , 21);
newRow = table.addRow();
newRow.setString( "name" , "Marco" );
newRow.setString( "age" , 27);
newRow = table.addRow();
newRow.setString( "name" , "Eren" );
newRow.setString( "age" , 23);
newRow = table.addRow();
newRow.setString( "name" , "Mikasa" );
newRow.setString( "age" , 23);
showTable();
} function getFindResults() {
clear();
let findQuery =
findQueryInput.value();
// Get the row values
// using findRow()
if (findQuery != "" ) {
// Find the result in
// the column of 'name'
findResults =
table.findRow(findQuery, 'name' );
if (findResults) {
text( "The row that matches the query is" ,
20, 120);
// Display the matched value
text(findResults.arr[0], 20, 140);
text(findResults.arr[1], 120, 140);
}
else text( "No Results Found" ,
20, 120);
} else {
text( "The query string is empty" ,
20, 120);
}
text( "Enter a string to find it in " +
"the 'name' column table" ,
20, 20);
} function showTable() {
clear();
// Display the total rows
// present in the table
text( "There are " +
table.getRowCount() +
" rows in the table" , 20, 120);
for (let r = 0; r < table.getRowCount(); r++)
for (let c = 0; c < table.getColumnCount(); c++)
text(table.getString(r, c),
20 + c * 100,
140 + r * 20);
text( "Enter a string to find it in " +
"the 'name' column table" ,
20, 20);
} |
Output:
Example 2:
function setup() {
createCanvas(500, 300);
textSize(16);
findQueryInput = createInput();
findQueryInput.position(30, 40);
getColBtn =
createButton( "Get the matching row" );
getColBtn.position(30, 70);
getColBtn.mouseClicked(getFindResults);
// Create the table
table = new p5.Table();
// Add two columns
table.addColumn( "name" );
table.addColumn( "age" );
// Add some rows to the table
let newRow = table.addRow();
newRow.setString( "name" , "Sam" );
newRow.setString( "age" , 23);
newRow = table.addRow();
newRow.setString( "name" , "Max" );
newRow.setString( "age" , 20);
newRow = table.addRow();
newRow.setString( "name" , "Ben" );
newRow.setString( "age" , 17);
newRow = table.addRow();
newRow.setString( "name" , "Sam" );
newRow.setString( "age" , 23);
showTable();
} function getFindResults() {
clear();
let findQuery = findQueryInput.value();
// Get the row values
// using findRow()
if (findQuery != "" ) {
// Find the result in the
// column with ID of '1'
findResults
= table.findRow(findQuery, 1);
if (findResults) {
text( "The row that matches the query is" ,
20, 120);
// Display the matched value
text(findResults.arr[0], 20, 140);
text(findResults.arr[1], 120, 140);
}
else text( "No Results Found" , 20, 120);
} else {
text( "The query string is empty" , 20, 120);
}
text( "Enter a string to find it " +
"in the 'age' column table" ,
20, 20);
} function showTable() {
clear();
// Display the total rows present in the table
text( "There are " +
table.getRowCount() +
" rows in the table" , 20, 120);
for (let r = 0; r < table.getRowCount(); r++)
for (let c = 0; c < table.getColumnCount(); c++)
text(table.getString(r, c),
20 + c * 100,
140 + r * 20);
text( "Enter a string to find it " +
"in the 'age' column table" ,
20, 20);
} |
Output:
Online editor: https://editor.p5js.org/
Environment Setup: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/amp/
Reference: https://p5js.org/reference/#/p5.Table/findRow