Using HTML to search a Google Sheet and return matched rowsHow to have a Google Form retrieve spreadsheet data and display it on a Google Site?How to perform a real time search and filter on a HTML tableRetrieve rows from spreadsheet data using google app scriptHow can I set the var subject in google forms script editor to return the values of specified fields in the form/sheet its is connected to?Cannot display HTML stringTimestamp from Google Forms returns NaN with getTime()Google Sheets: delete rows containing specified datamatch single cell value with column of values for every match return those rows Google-apps-scriptGoogle sheets match buyers and sellers between sheetsHow to pass google sheet header value into calendar event created from the form responses
Do the rules for the "Buying a Magic Item" downtime activity allow a character an opportunity to purchase the item later?
French equivalents of "a double bind"
speaker impedence
Map vs. Table for index-specific operations on 2D arrays
Is Sneak Attack damage halved on a successful Will save if a Wand of Cure Light Wounds is used to trigger the Sneak Attack?
Can I say "Gesundheit" if someone is coughing?
Reasons for using monsters as bioweapons
Why is “deal 6 damage” a legit phrase?
LWC component not rendering
Explained Variance
On the expression " sun-down"
Who's behind community AMIs on Amazon EC2?
How were x-ray diffraction patterns deciphered before computers?
Protect a 6 inch air hose from physical damage
Is the un-detonated globe of Otiluke's Freezing Sphere magical?
Why do we need a voltage divider when we get the same voltage at the output as the input?
"Fewer errors means better products" or "Fewer errors mean better products"?
How to determine if result of process substitution is a file path
Has J.J.Jameson ever found out that Peter Parker is Spider-Man?
How do I respond appropriately to an overseas company that obtained a visa for me without hiring me?
How did Biff return to 2015 from 1955 without a lightning strike?
What is the most 'environmentally friendly' way to learn to fly?
Need help identifying how to open this bolt/screw
Can it be useful for a player block with a hanging piece in a back rank mate situation?
Using HTML to search a Google Sheet and return matched rows
How to have a Google Form retrieve spreadsheet data and display it on a Google Site?How to perform a real time search and filter on a HTML tableRetrieve rows from spreadsheet data using google app scriptHow can I set the var subject in google forms script editor to return the values of specified fields in the form/sheet its is connected to?Cannot display HTML stringTimestamp from Google Forms returns NaN with getTime()Google Sheets: delete rows containing specified datamatch single cell value with column of values for every match return those rows Google-apps-scriptGoogle sheets match buyers and sellers between sheetsHow to pass google sheet header value into calendar event created from the form responses
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
I am basically trying to create a Web App using Google Apps Script using an HTML interface that would allow a user to search a Google Sheet for names, dates, and keywords and have the matched rows display on the search site.
My sheet contains numerous rows, but I am only concerned with 3 rows in particular: the name, the date, and the keywords. I would like to be able to search for all of the rows in my sheet that match the name, the date, and a keyword.
So far, I've tried following --> How to have a Google Form retrieve spreadsheet data and display it on a Google Site?
this link's instructions, however every time I hit submit it displays as null for the search results.
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<form method="get">
Responsible: <input type="text" id="responsible"/><br>
Date From: <input type="date" id="datefrom"/>
Date To: <input type="date" id="dateto"/><br>
Description: <input type="text" id="description"/><br>
<button onclick="gatherSearch()">Search</button>
<input type="reset" value="Reset">
</form>
</body>
</html>
Ideally, this is what the form would look like. I'd be able to either specify a name, a date, and a description (or a mix of a bunch) and it would return the rows that match my search.
Any help or pointers in the right direction would be greatly appreciated :)
EDIT
Below is my gatherSearch function, which gathers the text in the search bars from the HTML page and forwards it off to my .gs file to handle the searching.
function gatherSearch()
var responsible = document.getElementById('responsible').value;
var datefrom = formatDate(document.getElementById('datefrom').value);
var dateto = formatDate(document.getElementById('dateto').value);
var description = document.getElementById('description').value;
google.script.run.basicSearch(responsible, datefrom, dateto, description);
}
html forms google-apps-script
add a comment |
I am basically trying to create a Web App using Google Apps Script using an HTML interface that would allow a user to search a Google Sheet for names, dates, and keywords and have the matched rows display on the search site.
My sheet contains numerous rows, but I am only concerned with 3 rows in particular: the name, the date, and the keywords. I would like to be able to search for all of the rows in my sheet that match the name, the date, and a keyword.
So far, I've tried following --> How to have a Google Form retrieve spreadsheet data and display it on a Google Site?
this link's instructions, however every time I hit submit it displays as null for the search results.
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<form method="get">
Responsible: <input type="text" id="responsible"/><br>
Date From: <input type="date" id="datefrom"/>
Date To: <input type="date" id="dateto"/><br>
Description: <input type="text" id="description"/><br>
<button onclick="gatherSearch()">Search</button>
<input type="reset" value="Reset">
</form>
</body>
</html>
Ideally, this is what the form would look like. I'd be able to either specify a name, a date, and a description (or a mix of a bunch) and it would return the rows that match my search.
Any help or pointers in the right direction would be greatly appreciated :)
EDIT
Below is my gatherSearch function, which gathers the text in the search bars from the HTML page and forwards it off to my .gs file to handle the searching.
function gatherSearch()
var responsible = document.getElementById('responsible').value;
var datefrom = formatDate(document.getElementById('datefrom').value);
var dateto = formatDate(document.getElementById('dateto').value);
var description = document.getElementById('description').value;
google.script.run.basicSearch(responsible, datefrom, dateto, description);
}
html forms google-apps-script
1
Where isgatherSearch()
function?
– TheMaster
Mar 27 at 8:18
@TheMaster I provided the gatherSearch() function, the actual searching of the rows is done on the .gs side of things (haven't actually developed this yet)
– Jackson Gayda
Mar 27 at 15:39
Review developers.google.com/apps-script/guides/html/communication (you never tell your server function where to send the output...) Also review the allowed serializable data types.
– tehhowch
Mar 27 at 16:07
add a comment |
I am basically trying to create a Web App using Google Apps Script using an HTML interface that would allow a user to search a Google Sheet for names, dates, and keywords and have the matched rows display on the search site.
My sheet contains numerous rows, but I am only concerned with 3 rows in particular: the name, the date, and the keywords. I would like to be able to search for all of the rows in my sheet that match the name, the date, and a keyword.
So far, I've tried following --> How to have a Google Form retrieve spreadsheet data and display it on a Google Site?
this link's instructions, however every time I hit submit it displays as null for the search results.
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<form method="get">
Responsible: <input type="text" id="responsible"/><br>
Date From: <input type="date" id="datefrom"/>
Date To: <input type="date" id="dateto"/><br>
Description: <input type="text" id="description"/><br>
<button onclick="gatherSearch()">Search</button>
<input type="reset" value="Reset">
</form>
</body>
</html>
Ideally, this is what the form would look like. I'd be able to either specify a name, a date, and a description (or a mix of a bunch) and it would return the rows that match my search.
Any help or pointers in the right direction would be greatly appreciated :)
EDIT
Below is my gatherSearch function, which gathers the text in the search bars from the HTML page and forwards it off to my .gs file to handle the searching.
function gatherSearch()
var responsible = document.getElementById('responsible').value;
var datefrom = formatDate(document.getElementById('datefrom').value);
var dateto = formatDate(document.getElementById('dateto').value);
var description = document.getElementById('description').value;
google.script.run.basicSearch(responsible, datefrom, dateto, description);
}
html forms google-apps-script
I am basically trying to create a Web App using Google Apps Script using an HTML interface that would allow a user to search a Google Sheet for names, dates, and keywords and have the matched rows display on the search site.
My sheet contains numerous rows, but I am only concerned with 3 rows in particular: the name, the date, and the keywords. I would like to be able to search for all of the rows in my sheet that match the name, the date, and a keyword.
So far, I've tried following --> How to have a Google Form retrieve spreadsheet data and display it on a Google Site?
this link's instructions, however every time I hit submit it displays as null for the search results.
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<form method="get">
Responsible: <input type="text" id="responsible"/><br>
Date From: <input type="date" id="datefrom"/>
Date To: <input type="date" id="dateto"/><br>
Description: <input type="text" id="description"/><br>
<button onclick="gatherSearch()">Search</button>
<input type="reset" value="Reset">
</form>
</body>
</html>
Ideally, this is what the form would look like. I'd be able to either specify a name, a date, and a description (or a mix of a bunch) and it would return the rows that match my search.
Any help or pointers in the right direction would be greatly appreciated :)
EDIT
Below is my gatherSearch function, which gathers the text in the search bars from the HTML page and forwards it off to my .gs file to handle the searching.
function gatherSearch()
var responsible = document.getElementById('responsible').value;
var datefrom = formatDate(document.getElementById('datefrom').value);
var dateto = formatDate(document.getElementById('dateto').value);
var description = document.getElementById('description').value;
google.script.run.basicSearch(responsible, datefrom, dateto, description);
}
html forms google-apps-script
html forms google-apps-script
edited Mar 27 at 15:27
Jackson Gayda
asked Mar 26 at 23:59
Jackson GaydaJackson Gayda
63 bronze badges
63 bronze badges
1
Where isgatherSearch()
function?
– TheMaster
Mar 27 at 8:18
@TheMaster I provided the gatherSearch() function, the actual searching of the rows is done on the .gs side of things (haven't actually developed this yet)
– Jackson Gayda
Mar 27 at 15:39
Review developers.google.com/apps-script/guides/html/communication (you never tell your server function where to send the output...) Also review the allowed serializable data types.
– tehhowch
Mar 27 at 16:07
add a comment |
1
Where isgatherSearch()
function?
– TheMaster
Mar 27 at 8:18
@TheMaster I provided the gatherSearch() function, the actual searching of the rows is done on the .gs side of things (haven't actually developed this yet)
– Jackson Gayda
Mar 27 at 15:39
Review developers.google.com/apps-script/guides/html/communication (you never tell your server function where to send the output...) Also review the allowed serializable data types.
– tehhowch
Mar 27 at 16:07
1
1
Where is
gatherSearch()
function?– TheMaster
Mar 27 at 8:18
Where is
gatherSearch()
function?– TheMaster
Mar 27 at 8:18
@TheMaster I provided the gatherSearch() function, the actual searching of the rows is done on the .gs side of things (haven't actually developed this yet)
– Jackson Gayda
Mar 27 at 15:39
@TheMaster I provided the gatherSearch() function, the actual searching of the rows is done on the .gs side of things (haven't actually developed this yet)
– Jackson Gayda
Mar 27 at 15:39
Review developers.google.com/apps-script/guides/html/communication (you never tell your server function where to send the output...) Also review the allowed serializable data types.
– tehhowch
Mar 27 at 16:07
Review developers.google.com/apps-script/guides/html/communication (you never tell your server function where to send the output...) Also review the allowed serializable data types.
– tehhowch
Mar 27 at 16:07
add a comment |
1 Answer
1
active
oldest
votes
I've just done something very similar to you Jackson using the Google Sheets Api. I followed this guide to get it working. Assuming you have already setup the Google Sheets Api go to Step 2. The example function they have there called listMajors() is what you will be looking to do.
function listMajors()
gapi.client.sheets.spreadsheets.values.get(
spreadsheetId: 'YOUR_SPREADSHEET_ID',
range: 'THE_RANGE_YOU_NEED_TO_SELECT',
).then(function(response)
var range = response.result;
// If you get results back
if (range.values.length > 0)
appendPre('Name, Major:');
for (i = 0; i < range.values.length; i++)
var row = range.values[i];
// Print columns A and E, which correspond to indices 0 and 4.
appendPre(row[0] + ', ' + row[4]);
else
appendPre('No data found.');
, function(response)
appendPre('Error: ' + response.result.error.message);
);
What you would need to do is for each result you get back, append it to a list, or table to display the list of results. So say you get Name, Date, and Keyword you would then inside the for loop in the above example append each row, var result = result.value[i]
to a table or something like that.
You can check out more on reading and writing to Google Sheets using the API here
1
Thank you @CallumR I'll give this a shot :)
– Jackson Gayda
Mar 27 at 21:02
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55367882%2fusing-html-to-search-a-google-sheet-and-return-matched-rows%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
I've just done something very similar to you Jackson using the Google Sheets Api. I followed this guide to get it working. Assuming you have already setup the Google Sheets Api go to Step 2. The example function they have there called listMajors() is what you will be looking to do.
function listMajors()
gapi.client.sheets.spreadsheets.values.get(
spreadsheetId: 'YOUR_SPREADSHEET_ID',
range: 'THE_RANGE_YOU_NEED_TO_SELECT',
).then(function(response)
var range = response.result;
// If you get results back
if (range.values.length > 0)
appendPre('Name, Major:');
for (i = 0; i < range.values.length; i++)
var row = range.values[i];
// Print columns A and E, which correspond to indices 0 and 4.
appendPre(row[0] + ', ' + row[4]);
else
appendPre('No data found.');
, function(response)
appendPre('Error: ' + response.result.error.message);
);
What you would need to do is for each result you get back, append it to a list, or table to display the list of results. So say you get Name, Date, and Keyword you would then inside the for loop in the above example append each row, var result = result.value[i]
to a table or something like that.
You can check out more on reading and writing to Google Sheets using the API here
1
Thank you @CallumR I'll give this a shot :)
– Jackson Gayda
Mar 27 at 21:02
add a comment |
I've just done something very similar to you Jackson using the Google Sheets Api. I followed this guide to get it working. Assuming you have already setup the Google Sheets Api go to Step 2. The example function they have there called listMajors() is what you will be looking to do.
function listMajors()
gapi.client.sheets.spreadsheets.values.get(
spreadsheetId: 'YOUR_SPREADSHEET_ID',
range: 'THE_RANGE_YOU_NEED_TO_SELECT',
).then(function(response)
var range = response.result;
// If you get results back
if (range.values.length > 0)
appendPre('Name, Major:');
for (i = 0; i < range.values.length; i++)
var row = range.values[i];
// Print columns A and E, which correspond to indices 0 and 4.
appendPre(row[0] + ', ' + row[4]);
else
appendPre('No data found.');
, function(response)
appendPre('Error: ' + response.result.error.message);
);
What you would need to do is for each result you get back, append it to a list, or table to display the list of results. So say you get Name, Date, and Keyword you would then inside the for loop in the above example append each row, var result = result.value[i]
to a table or something like that.
You can check out more on reading and writing to Google Sheets using the API here
1
Thank you @CallumR I'll give this a shot :)
– Jackson Gayda
Mar 27 at 21:02
add a comment |
I've just done something very similar to you Jackson using the Google Sheets Api. I followed this guide to get it working. Assuming you have already setup the Google Sheets Api go to Step 2. The example function they have there called listMajors() is what you will be looking to do.
function listMajors()
gapi.client.sheets.spreadsheets.values.get(
spreadsheetId: 'YOUR_SPREADSHEET_ID',
range: 'THE_RANGE_YOU_NEED_TO_SELECT',
).then(function(response)
var range = response.result;
// If you get results back
if (range.values.length > 0)
appendPre('Name, Major:');
for (i = 0; i < range.values.length; i++)
var row = range.values[i];
// Print columns A and E, which correspond to indices 0 and 4.
appendPre(row[0] + ', ' + row[4]);
else
appendPre('No data found.');
, function(response)
appendPre('Error: ' + response.result.error.message);
);
What you would need to do is for each result you get back, append it to a list, or table to display the list of results. So say you get Name, Date, and Keyword you would then inside the for loop in the above example append each row, var result = result.value[i]
to a table or something like that.
You can check out more on reading and writing to Google Sheets using the API here
I've just done something very similar to you Jackson using the Google Sheets Api. I followed this guide to get it working. Assuming you have already setup the Google Sheets Api go to Step 2. The example function they have there called listMajors() is what you will be looking to do.
function listMajors()
gapi.client.sheets.spreadsheets.values.get(
spreadsheetId: 'YOUR_SPREADSHEET_ID',
range: 'THE_RANGE_YOU_NEED_TO_SELECT',
).then(function(response)
var range = response.result;
// If you get results back
if (range.values.length > 0)
appendPre('Name, Major:');
for (i = 0; i < range.values.length; i++)
var row = range.values[i];
// Print columns A and E, which correspond to indices 0 and 4.
appendPre(row[0] + ', ' + row[4]);
else
appendPre('No data found.');
, function(response)
appendPre('Error: ' + response.result.error.message);
);
What you would need to do is for each result you get back, append it to a list, or table to display the list of results. So say you get Name, Date, and Keyword you would then inside the for loop in the above example append each row, var result = result.value[i]
to a table or something like that.
You can check out more on reading and writing to Google Sheets using the API here
edited Mar 27 at 0:23
answered Mar 27 at 0:13
CallumCallum
5271 silver badge14 bronze badges
5271 silver badge14 bronze badges
1
Thank you @CallumR I'll give this a shot :)
– Jackson Gayda
Mar 27 at 21:02
add a comment |
1
Thank you @CallumR I'll give this a shot :)
– Jackson Gayda
Mar 27 at 21:02
1
1
Thank you @CallumR I'll give this a shot :)
– Jackson Gayda
Mar 27 at 21:02
Thank you @CallumR I'll give this a shot :)
– Jackson Gayda
Mar 27 at 21:02
add a comment |
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55367882%2fusing-html-to-search-a-google-sheet-and-return-matched-rows%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Where is
gatherSearch()
function?– TheMaster
Mar 27 at 8:18
@TheMaster I provided the gatherSearch() function, the actual searching of the rows is done on the .gs side of things (haven't actually developed this yet)
– Jackson Gayda
Mar 27 at 15:39
Review developers.google.com/apps-script/guides/html/communication (you never tell your server function where to send the output...) Also review the allowed serializable data types.
– tehhowch
Mar 27 at 16:07