Stack Overflow em Português Asked on September 27, 2021
Meu código possui um <script>
que deve exibir o nome do fornecedor e o nome do produto em cada <select>
utilizando o atributo <title>
, só que ao invés disso exibe o valor da chave.
Você escolheu o fornecedor Roupas & CIA
na legenda criada pelo <title>
exibe Você escolheu o fornecedor 1
.Queria entender como mostrar seu nome ao invés de sua chave.
// Script que mostra uma legenda personalizada com o nome do fornecedor e nome do produto em cada <select>, porém está errado aqui.
<script>
function onChangeSelect(select) {
document.getElementById("cd_fornecedor").title = "Você escolheu o fornecedor " + select.value;
document.getElementById("cd_produto").title = "Você escolheu o produto " + select.value;
}
</script>
// Resto do código em PHP
<!DOCTYPE html>
<html lang="pt-br">
<head>
<title>Cadastrar item de compra</title>
<link rel="stylesheet" href="/WEB/css/css.css">
</head>
<body>
<?php
require_once '../conexao/conexao.php';
if (isset($_POST['Inserir'])) {
$cd_fornecedor = $_POST['cd_fornecedor'];
$cd_produto = $_POST['cd_produto'];
try {
$insercao = "INSERT INTO itens_compra_fornecedor (cd_fornecedor,cd_produto,data_compra)
VALUES (:cd_fornecedor,:cd_produto,CURRENT_TIMESTAMP())";
$insere_dados = $conexao->prepare($insercao);
$insere_dados->bindValue(':cd_fornecedor',$cd_fornecedor);
$insere_dados->bindValue(':cd_produto',$cd_produto);
$insere_dados->execute();
} catch (PDOException $falha_insercao) {
echo "A insercão não foi feita".$falha_insercao->getMessage();
}
}
$seleciona_fornecedor = $conexao->query("SELECT cd_fornecedor, nome FROM fornecedor");
$resultado_fornecedor = $seleciona_fornecedor->fetchAll();
$seleciona_produto = $conexao->query("SELECT cd_produto, nome FROM produto");
$resultado_produto = $seleciona_produto->fetchAll();
?>
<form method="POST" onsubmit="exibirNome()">
<p> Fornecedor:
<select name="cd_fornecedor" id="cd_fornecedor" onchange="onChangeSelect(this)" required="" title="Escolha o fornecedor">
<option value="" title="Por padrão a opção é vazia, escolha abaixo o fornecedor"> </option>
<?php
foreach ($resultado_fornecedor as $v1) {
echo "<option value='{$v1['cd_fornecedor']}'>{$v1['nome']}</option>";
}
?>
</select>
</p>
<p> Produto:
<select name="cd_produto" id="cd_produto" required="" title="Escolha a peça de roupa">
<option value="" title="Por padrão a opção é vazia, escolha abaixo a peça de roupa desejada"> </option>
<?php
foreach ($resultado_produto as $v2) {
echo "<option value='{$v2['cd_produto']}'>{$v2['nome']}</option>";
}
?>
</select>
</p>
<button name="Inserir" title="Botão para cadastrar o item de compra"> Cadastrar item de compra </button>
</form>
</body>
</html>
@Vorbbel, esse funciona! Apesar de eu não ter entendido onde você usa isso, deve ser na função que roda ao submeter o formulário onsubmit="exibirNome()" que não postou na pergunta!
function onChangeSelect(obj)
{
/* armazena titulo original */
if(!obj.originalTitle){
obj.originalTitle = obj.title;
}
let prependTexto = "Você escolheu";
let textoSelecionado = obj.options[obj.selectedIndex].value != "" ? prependTexto + " " + obj.options[obj.selectedIndex].text : obj.originalTitle;
/* mudo o title do select */
obj.title = textoSelecionado;
}
<p> Fornecedor:
<select name="cd_fornecedor" id="cd_fornecedor" onChange="onChangeSelect(this);" required="" title="Escolha o fornecedor">
<option value="" title="Por padrão a opção é vazia, escolha abaixo o fornecedor"> </option>
<option value='1'>Fornecedor UM</option>
<option value='2'>Fornecedor DOIS</option>
</select>
</p>
<p> Produto:
<select name="cd_produto" id="cd_produto" onChange="onChangeSelect(this);" required="" title="Escolha a peça de roupa">
<option value="" title="Por padrão a opção é vazia, escolha abaixo a peça de roupa desejada"> </option>
<option value='cd_01'>CALÇA</option>
<option value='cd_02'>VESTIDO</option>
</select>
</p>
Correct answer by Duda Gervásio on September 27, 2021
Pode pegar o texto do option dessa maneira options[cd_produto.selectedIndex].text
Exemplo funcional clique em executar após o código
function onChangeSelect()
{
let fornecedor = document.getElementById("cd_fornecedor").options[cd_fornecedor.selectedIndex].text;
let roupa = document.getElementById("cd_produto").options[cd_produto.selectedIndex].text;
/* #### no seu script tem que ser #######################################
document.getElementById("cd_fornecedor").title = "Você escolheu o fornecedor " + fornecedor;
document.getElementById("cd_produto").title = "Você escolheu o produto " + roupa;
##################################################################### */
/* #### esse trecho é só pra exibir no executar ########## */
if(fornecedor!=""){
console.log (fornecedor);
}
if(roupa!=""){
console.log (roupa);
}
/* ####################################################### */
}
<p> Fornecedor:
<select name="cd_fornecedor" id="cd_fornecedor" onChange="onChangeSelect();" required="" title="Escolha o fornecedor">
<option value="" title="Por padrão a opção é vazia, escolha abaixo o fornecedor"> </option>
<option value='1'>Fornecedor UM</option>
<option value='2'>Fornecedor DOIS</option>
</select>
</p>
<p> Produto:
<select name="cd_produto" id="cd_produto" onChange="onChangeSelect();" required="" title="Escolha a peça de roupa">
<option value="" title="Por padrão a opção é vazia, escolha abaixo a peça de roupa desejada"> </option>
<option value='cd_01'>CALÇA</option>
<option value='cd_02'>VESTIDO</option>
</select>
</p>
ou dessa maneira (select.options[select.selectedIndex].text)
Exemplo funcional clique em executar após o código
function onChangeSelect1(select) {
let fornecedor =(select.options[select.selectedIndex].text);
console.log(fornecedor);
}
function onChangeSelect2(select) {
let roupa =(select.options[select.selectedIndex].text);
console.log(roupa);
}
<p> Fornecedor:
<select name="cd_fornecedor" id="cd_fornecedor" onChange="onChangeSelect1(this);" required="" title="Escolha o fornecedor">
<option value="" title="Por padrão a opção é vazia, escolha abaixo o fornecedor"> </option>
<option value='1'>Fornecedor UM</option>
<option value='2'>Fornecedor DOIS</option>
</select>
</p>
<p> Produto:
<select name="cd_produto" id="cd_produto" onChange="onChangeSelect2(this);" required="" title="Escolha a peça de roupa">
<option value="" title="Por padrão a opção é vazia, escolha abaixo a peça de roupa desejada"> </option>
<option value='cd_01'>CALÇA</option>
<option value='cd_02'>VESTIDO</option>
</select>
</p>
Answered by user60252 on September 27, 2021
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP