Connect Database with HTML

Asked

Viewed 785 times

-2

How do I connect my database to html?

HTML CODE

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CADASTRO DE CLIENTES COM BANCO DE DADOS E PHP</title>
<style type="text/css">
<!--
.style1 {
color: #FF0000;
font-size: x-small;
}
.style3 {color:#7678ff; font-size: x-small; }
</style>
<script type="text/javascript">
function validaCampo()
{
if(document.cadastro.nome.value=="")
{
alert("O Campo nome é obrigatório!");
return false;
}
else
if(document.cadastro.email.value=="")
{
alert("O Campo email é obrigatório!");
return false;
}
else
if(document.cadastro.endereco.value=="")
{
alert("O Campo endereço é obrigatório!");
return false;
}
else
if(document.cadastro.cidade.value=="")
{
alert("O Campo Cidade é obrigatório!");
return false;
}
else
if(document.cadastro.estado.value=="")
{
alert("O Campo Estado é obrigatório!");
return false;
}
else
if(document.cadastro.bairro.value=="")
{
alert("O Campo Bairro é obrigatório!");
return false;
}
else
if(document.cadastro.pais.value=="")
{
alert("O Campo país é obrigatório!");
return false;
}
else
if(document.cadastro.login.value=="")
{
alert("O Campo Login é obrigatório!");
return false;
}
var password = document.getElementById("password")
  , confirm_password = document.getElementById("confirm_password");

function validatePassword(){
  if(password.value != confirm_password.value) {
    confirm_password.setCustomValidity("Senhas diferentes!");
  } else {
    confirm_password.setCustomValidity('');
  }
}

password.onchange = validatePassword;
confirm_password.onkeyup = validatePassword;

else
if(document.cadastro.senha.value=="")
{
alert("Digite uma senha!");
return false;
}
else
return true;
}

<!-- Fim do JavaScript que validará os campos obrigatórios! -->
</script>
</head>

<body>
<form id="cadastro" name="cadastro" method="post" action="cadastro.php" onsubmit="return validaCampo(); return false;">
  <table width="625" border="0">
    <tr>
      <td width="69">Nome:</td>
      <td width="546"><input name="nome" type="text" id="nome" size="70" maxlength="60" />
        <span class="style1">*</span></td>
    </tr>
    <tr>
      <td>Email:</td>
      <td><input name="email" type="text" id="email" size="70" maxlength="60" />
      <span class="style1">*</span></td>
    </tr>
    <tr>
     <td>CPF:</td>
      <td><input name="cpf" type="text" id="cpf" size="70" maxlength="60" />
      <span class="style1">*</span></td>
        </tr>
    <tr>
      <td>RG:</td>
      <td><input name="rg" type="text" id="rg" size="70" maxlength="60" />
      <span class="style1">*</span></td>
      </tr>
    <tr>
      <td>Sexo:</td>
      <td><input name="sexo" type="radio" value="Masculino" checked="checked" />
        Masculino
        <input name="sexo" type="radio" value="Feminino" />
        Feminino <span class="style1">*</span> </td>
    </tr>
    <tr>
      <td>Telefone</td>
      <td>

        <input name="telefone" type="text" id="telefone" 
       size ="70" maxlength="60"/>
        <span class="style3">Apenas números</span> </td>
    </tr>
    <tr>
      <td>Endereço:</td>
      <td><input name="endereco" type="text" id="endereco" size="70" maxlength="70" />
        <span class="style1">*</span></td>
    </tr>
    <tr>
      <td>Cidade:</td>
      <td><input name="cidade" type="text" id="cidade" maxlength="20" />
        <span class="style1">*</span></td>
    </tr>
    <tr>
      <td>Estado:</td>
      <td><select name="estado" id="estado">
        <option>Selecione...</option>
        <option value="AC">AC</option>
        <option value="AL">AL</option>
        <option value="AP">AP</option>
        <option value="AM">AM</option>
        <option value="BA">BA</option>
        <option value="CE">CE</option>
        <option value="ES">ES</option>
        <option value="DF">DF</option>
        <option value="MA">MA</option>
        <option value="MT">MT</option>
        <option value="MS">MS</option>
        <option value="MG">MG</option>
        <option value="PA">PA</option>
        <option value="PB">PB</option>
        <option value="PR">PR</option>
        <option value="PE">PE</option>
        <option value="PI">PI</option>
        <option value="RJ">RJ</option>
        <option value="RN">RN</option>
        <option value="RS">RS</option>
        <option value="RO">RO</option>
        <option value="RR">RR</option>
        <option value="SC">SC</option>
        <option value="SP">SP</option>
        <option value="SE">SE</option>
        <option value="TO">TO</option>
          </select>
        <span class="style1">*      </span></td>
    </tr>
    <tr>
      <td>Bairro:</td>
      <td><input name="bairro" type="text" id="bairro" maxlength="20" />
        <span class="style1">*</span></td>
    </tr>
    <tr>
      <td>País:</td>
      <td><input name="pais" type="text" id="pais" maxlength="20" />
        <span class="style1">*</span></td>
    </tr>
    <tr>

    </tr>
    <tr>
      <td>Senha:</td>
      <td><input name="senha" type="password" id="senha" maxlength="12" />
          <span class="style1">*</span></td>
    </tr>
    <tr>
      <td colspan="2"><input name="news" type="checkbox" id="news" value="ATIVO" checked="checked" />
Desejo receber novidades e informações sobre o conteúdo deste site. </td>
    </tr>
    <tr>
      <td colspan="2"><p>
        <input name="cadastrar" type="submit" id="cadastrar" value="Concluir meu Cadastro!" />


          <input name="limpar" type="reset" id="limpar" value="Limpar Campos preenchidos!" />


          <span class="style1">* Campos com * são obrigatórios!          </span></p>
      <p>  </p></td>
    </tr>
  </table>
</form>
</body>
</html>

PHP CODE

<title>Cadastro realizado com sucesso!</title>
</head>
<body>
<?php 
// RECEBENDO OS DADOS PREENCHIDOS DO FORMULÁRIO !

$nome= $_POST ["nome"];//atribuição do campo "nome" vindo do formulário para variavel
$email= $_POST ["email"];//atribuição do campo "email" vindo do formulário para variavel
$cpf= $_POST ["cpf"];//atribuição do campo "cpf" vindo do formulário para variavel
$rg= $_POST ["rg"];//atribuição do campo "rg" vindo do formulário para variavel
$tel= $_POST ["telefone"];//atribuição do campo "telefone" vindo do formulário para variavel
$endereco= $_POST ["endereco"];//atribuição do campo "endereco" vindo do formulário para variavel
$cidade= $_POST ["cidade"];//atribuição do campo "cidade" vindo do formulário para variavel
$estado= $_POST ["estado"];//atribuição do campo "estado" vindo do formulário para variavel
$bairro = $_POST ["bairro"];//atribuição do campo "bairro" vindo do formulário para variavel
$pais= $_POST ["pais"];//atribuição do campo "pais" vindo do formulário para variavel
$senha= $_POST ["senha"];//atribuição do campo "senha" vindo do formulário para variavel
$news= $_POST ["news"];//atribuição do campo "news" vindo do formulário para variavel
$sexo= $_POST ["sexo"];//atribuição do campo "sexo" vindo do formulário para variavel

//Gravando no banco de dados ! conectando com o localhost - mysql
$conexao = mysql_connect("localhost","root"); //localhost é onde esta o banco de dados.
if (!$conexao)
die ("Erro de conexão com localhost, o seguinte erro ocorreu -> ".mysql_error());

//conectando com a tabela do banco de dados
$banco = mysql_select_db("clientes",$conexao); //nome da tabela que deseja que seja inserida os dados cadastrais
if (!$banco)
die ("Erro de conexão com banco de dados, o seguinte erro ocorreu -> ".mysql_error());


//Query que realiza a inserção dos dados no banco de dados na tabela indicada acima
$query = "INSERT INTO `clientes` ( `nome` , `email` ,`cpf`,`rg`,`sexo`,`telefone` , `endereço` , `cidade` , `estado` , `bairro` , `país` , `senha` , `news` , `id` ) 
VALUES ('$nome', '$email','$cpf','$rg','$sexo','$tel', '$endereco', '$cidade', '$estado', '$bairro', '$pais','$senha', '$news', '')";
mysql_query($query,$conexao);
########## • Explicação da query • ##########
#$query = nome da variavel que decidi#
#utilizar para realizar a operação.#
#############################################
#clientes = nome da tabela que será salvo#
#os dados do cadastro do cliente#
#############################################
#nome, email,cpf,rg, sexo, telefone,#
#endereço, cidade, estado, bairro, país,#
#senha, news, id.#
##
#São apenas os nomes dos campos que #
#constam na tabela clientes.#
#############################
#VALUES = indica que serão inseridos os#
#seguintes valores.#
#############################################
#$nome, $email,$cpf,$rg,$sexo,$telefone,#
#$endereço, $cidade, $estado, $bairro, #
#$país,$senha, $news, $id.#
#############################
#São apenas as variaveis a qual eu#
#atribui os valores digitados no formulá-#
#rio.#
#############################################
echo "Seu cadastro foi realizado com sucesso!Agradecemos a atenção.";
//mensagem que é escrita quando os dados são inseridos normalmente.
mysqli_close($conexao,$query);
?> 
</body>
</html>

MYSQL CODE

CREATE TABLE `clientes` (
`nome` VARCHAR( 60 ) NOT NULL ,
`email` VARCHAR( 60 ) NOT NULL ,
`cpf` VARCHAR( 60 ) NOT NULL ,
`rg` VARCHAR( 60 ) NOT NULL ,
`telefone` VARCHAR( 60 ) ,
`endereço` VARCHAR( 70 ) NOT NULL ,
`cidade` VARCHAR( 20 ) NOT NULL ,
`estado` VARCHAR( 2 ) NOT NULL ,
`bairro` VARCHAR( 20 ) NOT NULL ,
`país` VARCHAR( 20 ) NOT NULL ,
`login` VARCHAR( 12 ) NOT NULL ,
`senha` VARCHAR( 12 ) NOT NULL ,
`news` VARCHAR( 8 ) ,
`id` INT( 200 ) AUTO_INCREMENT ,
UNIQUE (
`id` 
)
);

Localhost error

Notice: Undefined index: name in C: xampp phpMyAdmin index.php on line 10

Notice: Undefined index: email in C: xampp phpMyAdmin index.php on line 11

Notice: Undefined index: Cpf in C: xampp phpMyAdmin index.php on line 12

Notice: Undefined index: rg in C: xampp phpMyAdmin index.php on line 13

Notice: Undefined index: sex in C: xampp phpMyAdmin index.php on line 14

Notice: Undefined index: telefone in C: xampp phpMyAdmin index.php on line 15

Notice: Undefined index: endereco in C: xampp phpMyAdmin index.php on line 16

Notice: Undefined index: city in C: xampp phpMyAdmin index.php on line 17

Notice: Undefined index: estado in C: xampp phpMyAdmin index.php on line 18

Notice: Undefined index: bairro in C: xampp phpMyAdmin index.php on line 19

Notice: Undefined index: pais in C: xampp phpMyAdmin index.php on line 20

Notice: Undefined index: password in C: xampp phpMyAdmin index.php on line 21

Notice: Undefined index: news in C: xampp phpMyAdmin index.php on line 22

Warning: mysqli::__Construct() expects at Most 6 Parameters, 13 Given in C: xampp phpMyAdmin index.php on line 25

Fatal error: Uncaught Error: Call to Undefined Function mysql_connect() in C: xampp phpMyAdmin index.php:26 Stack trace: #0 {main} thrown in C: xampp phpMyAdmin index.php on line 26

php html database

  • I suggest you edit the question, the HTML is a language to display content in the browser and does not connect to database, in your case this will be done in the php. Study what makes the command $_POST php, see that your html sends the form to the "cadastro.php" page and you’re trying to read the data on another "index.php" page"

  • You can just add "required" after the inputs to say it’s mandatory, it’s simpler. You keep only the script to check if the password and password confirmation are equal.

  • The error messages do not reflect the code posted in the question. Need to [Edit] the question and put the right code or the correct messages.

1 answer

1

Hello. Your first problem is understanding the architecture of a web application.

In your HTML you point the form action to a file (action="cadastre.php"), but seeing the errors generated it is noted that you are trying to process the index.php file. This way, we try to access variables in the header ($_POST) that do not exist. See the error:

Notice: Undefined index: name in C: xampp phpMyAdmin index.php on line 10

Basically: the index name is undefined at line 10 of index.php.

You should process the.php registration file after the HTML page form has been subdued (envoy). In doing so, these mistakes will disappear.

Another problem is the connection to the comic book. See the error shown:

Warning: mysqli::__Construct() expects at Most 6 Parameters, 13 Given in C: xampp phpMyAdmin index.php on line 25

This connection is wrong. I recommend using PDO because it is native:

$conn = new PDO(
    'mysql:host=localhost;dbname=clientes', 'root', 'senha'
);

This ensures a connection to the database. When using PDO, you better change the way you handle Mysql transactions. Use Prepared Statement:

$stmt = $conn->prepare(
'INSERT INTO posts (title, content) VALUES (:title, :content)');
$title = 'Titulo do post';
$content = 'Conteudo do post';

$stmt->bindValue(':title', $title);
$stmt->bindValue(':content', $content);
$stmt->execute();

Browser other questions tagged php html database

You are not signed in. Login or sign up in order to post.