How to make same as email but now with name "already taken"

[SWEz11]

Hello I want to ask how to make same as email but now with name "already taken" I tried but didn't work.

<?php

$mysqli = require __DIR__ . "/database.php";

// Check if $_GET["name"] is set and not empty
$name = isset($_GET["name"]) ? trim($_GET["name"]) : "";

// Check if email is not empty after trimming
if (!empty($name)) {
    $escaped_name = $mysqli->real_escape_string($name);

    $sql = "SELECT * FROM user WHERE name = '$escaped_name'";
    
    $result = $mysqli->query($sql);

    if ($result !== false) {
        $is_available = $result->num_rows === 0;
        echo json_encode(["available" => $is_available]);
    } else {
        die("Error: " . $mysqli->error);
    }
} else {
    echo json_encode(["error" => "Invalid or empty email parameter"]);
}
?>

I tried like this but didn't work

Thank you!

[SWEz11]

And i make it in validation.js:
validation

.addField("#name", [
    {
        rule: "required"
    },
    {
        rule: "name"
    },
    {
        validator: (value) => () => {
            return fetch("validate-name.php?email=" + encodeURIComponent(value))
                   .then(function(response) {
                       return response.json();
                   })
                   .then(function(json) {
                       return json.available;
                   });
        },
        errorMessage: "Name already taken"
    }
])

But it won't work

[daveh]

In what way doesn't it work? Do you get any error messages? Try debugging the code by inserting debugging statements to print out the values of the variables at different stages

[SWEz11]

Hello daveh,

Thank you for response!

It seems like just the validate-name.php be skipped when the button be pressed in register window. No errors. Did I need connect the validate-name.php with process-signup or something like that? Or need write specific code for name checking? Thanks:)

[daveh]

In your JavaScript, you're passing the name value in the query string with an index of "email":

return fetch("validate-name.php?email=" + encodeURIComponent(value))

but then getting this on the server with an index of name: $_GET["name"]

Try changing them so they match, e.g.

return fetch("validate-name.php?name=" + encodeURIComponent(value))

[SWEz11]

I already do it, but still didn't work

[daveh]

Check the browser console to see what JS requests are being made, and if there are any errors

[SWEz11]

That's I've got when I pressed signup button
From console I've got nothing

[daveh]

From that it looks like the JavaScript validation isn't running when you submit the form. Check the code that attaches the validation to the form, it could be that.

[SWEz11]

It seem the validation is attached, but from now when I go to the signup.html page it show error in console:

A somehow the code didn't change in website

This code from vs studio:

const validation = new JustValidate("#signup");

validation
    .addField("#name", [
        {
            rule: "required"
        },
        {
            rule: "name"
        },
        {
            validator: (value) => () => {
                return fetch("validate-name.php?name=" + encodeURIComponent(value))
                        .then(function(response) {
                        console.log("Server Response:", response);  // Add this line
                        return response.json();
                        })
                       .then(function(json) {
                           return json.available;
                       });
            },
            errorMessage: "Name already taken"
        }
    ])
    .addField("#email", [
        {
            rule: "required"
        },
        {
            rule: "email"
        },
        {
            validator: (value) => () => {
                return fetch("validate-email.php?email=" + encodeURIComponent(value))
                       .then(function(response) {
                           return response.json();
                       })
                       .then(function(json) {
                           return json.available;
                       });
            },
            errorMessage: "email already taken"
        }
    ])
    .addField("#password", [
        {
            rule: "required"
        },
        {
            rule: "password"
        }
    ])
    .addField("#password_confirmation", [
        {
            validator: (value, fields) => {
                return value === fields["#password"].elem.value;
            },
            errorMessage: "Passwords should match"
        }
    ])
    .onSuccess((event) => {
        document.getElementById("signup").submit();
    });

And what code I see in chrome:

const validation = new JustValidate("#signup");

validation
    .addField("#name", [
        {
            rule: "required"
        }
    ])
    .addField("#email", [
        {
            rule: "required"
        },
        {
            rule: "email"
        },
        {
            validator: (value) => () => {
                return fetch("validate-email.php?email=" + encodeURIComponent(value))
                       .then(function(response) {
                           return response.json();
                       })
                       .then(function(json) {
                           return json.available;
                       });
            },
            errorMessage: "email already taken"
        }
    ])
    .addField("#password", [
        {
            rule: "required"
        },
        {
            rule: "password"
        }
    ])
    .addField("#password_confirmation", [
        {
            validator: (value, fields) => {
                return value === fields["#password"].elem.value;
            },
            errorMessage: "Passwords should match"
        }
    ])
    .onSuccess((event) => {
        document.getElementById("signup").submit();
    });

But I don't know it make a sence.
But the error can be solution

[daveh]

If JustValidate is not defined, then it looks like that library isn't being loaded. Check the network console to see if there is an error when requesting that file, or make sure you're loading that file before your own one.

[SWEz11]

I added this line in signup.html:
<script src="https://unpkg.com/[email protected]/dist/js/just-validate.min.js"></script>
And now in network console show this:

Now it seems the validation.js is working but show the just-validate.min.js been failed it when you pressed on the just-validate.min.js text it in next page show this:

It can be the version problem but I don't know how to get normal link with normal version ( I get it from ChatGPT)

But when you enter already create name it still allow to signup

[daveh]

You can get it from the official website:

<script src="https://unpkg.com/just-validate@latest/dist/just-validate.production.min.js"></script>

[SWEz11]

Yea it work with js!

But still allow to use already taken name

[daveh]

Try debugging by seeing what value is being returned from the script that checks the email address and returns a value to the JavaScript

[SWEz11]

Now I tried in localhost Host and it seems the website signup.html see validation normally because in website Host it just validation look like this .addField("#name", [ { rule: "required" } ])

instead looking like this:
.addField("#name", [ { rule: "required" }, { rule: "name" }, { validator: (value) => () => { return fetch("validate-name.php?name=" + encodeURIComponent(value)) .then(function(response) { console.log("Server Response:", response); // Add this line return response.json(); }) .then(function(json) { return json.available; }); }, errorMessage: "Name already taken" } ])

In local host I'm getting signup.html console error:
Uncaught Error: Rule should be one of these types: required, email, minLength, maxLength, password, number, integer, maxNumber, minNumber, strongPassword, customRegexp, minFilesCount, maxFilesCount, files. Provided value: name at just-validate.production.min.js:1:18898 at Array.forEach (<anonymous>) at Object.addField (just-validate.production.min.js:1:18676) at validation.js:4:6

And I cant press signup button:

validation.js 4 line: 
` .addField("#name", [`.

PS: In both places (LocalHost , Website Host):
Read the validate-name.php: because when I enter websitename.com/path/path2/validate-name.php?name=5353

I'm getting this: 

[daveh]

Perhaps the syntax has changed in a more recent version of JustValidate - the documentation is here.

[SWEz11]

It work:)! But small problem: How why when I press the signup button without writting email address in email area. It just say email already exits if I didn't not write anything

[daveh]

Try debugging the script that checks the emails by running the PHP code directly with an empty string for the email address. You can run the PHP script directly by requesting it in the browser's address bar, passing the email in the query string. You can print out debugging statements to see what values the various statements in the PHP are returning, to see where the issue is.

[SWEz11]

Thank you daveh for all your support:)!