Dan Howard
Dan Howard

Reputation: 316

Google App Script: Compare a value from an HTML text box and return a message if it exists

I'm trying to create a simple database to handle some user Data. Currently I'm trying to work on an HTML page that creates new users. I have some code that can take input from the HTML page an insert it into a spreadsheet. The form asks for User Name, Password and Display Name. These then get passed into the spreadsheet. However, what I want to do is check that the User Name doesn't already exist and if it does, send a Popup back to the HTML page. I can't figure out that bit. So far I have:

function createNewPlayer(form) {
var playerSheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Players");
var lastColumn = playerSheet.getLastColumn()


var defaultsSheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Defaults");
var getDefaults = defaultsSheet.getRange(7, 3, 37, 1)
var defaults = getDefaults.getValues();

var name = form.PlayerName;
var password =form.Password;
var displayName = form.DisplayName



var playerNameRow = playerSheet.getRange(1, 4, 1, lastColumn - 1); // get all the columns
var playerNameValues = playerNameRow.getValues(); // get the values

var findPlayer = name;


for (var j = 0; j < playerNameValues[0].length; j++){
if (playerNameValues[0][j] == findPlayer) {
 IF THIS NAME EXISTS STOP THE PROCESS AND RETURN A POPUP ON THE PAGE}


var setName = playerSheet.getRange(1, lastColumn + 1, 1, 1);
var setPassword = playerSheet.getRange(2, lastColumn + 1, 1, 1);
var setDisplayName = playerSheet.getRange(3, lastColumn + 1, 1, 1);

var setDefault = playerSheet.getRange(5, lastColumn + 1, 37, 1);

setName.setValue(name);
setPassword.setValue(password);
setDisplayName.setValue(displayName);
setDefault.setValues(defaults)

You'll see there is a For Loop in the middle there that is where the script check for the existing entry. That works and if I log something there then the Logger accepts it. I just need to know how to send the Popup to the HTML page?

Added HTML for clarity:

<body> 
<h1> New </h1> 

<div class="block result-display" id="results"> 


<html>

<head>
    <title>Test Page</title>
</head>

<body>
    <form>
        Enter your Player Name<input type="text" value="" name="PlayerName"/><br>
        Enter your Password<input type="password" value="" name="Password"/><br>
        Enter your Display Name<input type="text" value="" name="DisplayName"/><br>
        <input type="button" onClick="formSubmit()" value="Submit" />
    </form>
</body>
<script type="text/javascript">
    function formSubmit() {
        google.script.run.createNewPlayer(document.forms[0]);
    }
</script>

Upvotes: 0

Views: 779

Answers (1)

Alan Wells
Alan Wells

Reputation: 31310

Add a withSuccessHandler(functionName) to your client side API call:

<script type="text/javascript">
    function formSubmit() {
      google.script.run
        .withSuccessHandler(showReturnedContent)
        .createNewPlayer(document.forms[0]);
    }

  window.showReturnedContent = function(rtrnedValue) {
    console.log("showReturnedContent ran!");
    console.log("rtrnedValue: " + rtrnedValue);

    //To Do - Add code to show new HTML content
  }
</script>

Upvotes: 1

Related Questions