Ir para conteúdo
Fórum Script Brasil
  • 0

Montar Tabela Com Dados Dos Textbox


Marc_Dias

Pergunta

bom dia a todos

Preciso de ajuda no seguinte problema:

tenho um combobox onde está populado com os nomes dos clientes de uma tabela e ao lado um textbox onde vai ser digitado um valor qualquer e ao lado do text um botão de comando.

preciso que o usuario escolha um nome no combo, digite um valor no text e ao clicar no botão vá montando uma tabela abaixo dos dados.

Link para o comentário
Compartilhar em outros sites

7 respostass a esta questão

Posts Recomendados

  • 0

Andréia

estou fazendo o seguinte:

inclusive com isso já matei a dúvida que tinha ontem

tenho uma tabela no meu banco com a seguinte estutura

codigo

serviço

valor

estou populando o combo box com todos os serviços que constam na tabela (com ASP)

no value no combo estou concatenando o código com "|" + a descrição do serviço + "|" + valor do servico

de modo que fique mais ou menos assim

option value = "123456|instalação de alarme|15,00"

depois coloquei uma função no OnChange do combo para pegar o value e dividir nos text de código e preço

agora eu quero que depois de escolhido o serviço clicar no botão e construir uma tabela, tendo em vista

que posso ter mais de um serviço, e também preciso da possibilidade de excluir um serviço da tabela (que

por exemplo o usuario tenha inserido errado)

Link para o comentário
Compartilhar em outros sites

  • 0

vamus por partes, veja se a ideia é +- essa:

<script>function Monta(campo_sel)
{
var arraySelects = campo_sel.split("|");
var tamanho = arraySelects.length;
var tabela=document.getElementById('tabela').insertRow(1);
for (i=0; i < tamanho; i++)
{
    tabela.insertCell(i).innerHTML=arraySelects[i];
}
}
</script>


<select name="selects" onchange="Monta(this.value)">
<option value="123456|instalação de alarme|15,00">123456|instalação de alarme|15,00</option>
<option value="654321|instalação de alarme2|45,00">654321|instalação de alarme2|45,00</option>
<option value="987012|instalação de alarme3|30,00">987012|instalação de alarme3|30,00</option>
</select>

<table id="tabela" border="1" cellspacing="0">
    <tr>
    </tr>
</table>

Link para o comentário
Compartilhar em outros sites

  • 0
Guest --MARC_DIAS --

Andréia, está função é mais ou menos igual a que já fiz, a unica diferenca é que populo o combo com asp

só que alem do combo eu tenho dois text quando eu escolho no combo ele joga os valores pro text certo

depois do text tenho um botão.

combo para escolha - text para o código - text para o valor - botao de comando

ao clicar no botão construir uma tabela embaixo...

fazer a tabela eu já consegui....agora o que preciso e colocar um botão nas linhas para excluir um serviço que

não for utilizar

vou te mandar meu código...dá uma olhada e vê o que pode ser feito?? muito obrigado

<html>
<body>
<form name="servico" id="servico">

<script type="text/javascript">
function AddLinhaServico(){

    if (document.servico.txtServicos.value == ''){
    alert('Serviço em branco, verifique!');
    document.servico.txtServicos.focus();
    return false;
    }
  if (document.servico.txtValorServico.value == ''){
    alert('Valor em branco!');
    document.servico.txtValorServico.focus();
    return false;
    }

  obj = document.getElementById('divTabelaServicos');
    if (obj.style.display == "none")
            obj.style.display = "block";

    var table1 = document.getElementById("tabela2");
    totLinhas = table1.rows.length -1;
    var linha = table1.insertRow(totLinhas);

    var coluna1 = linha.insertCell(-1);
    coluna1.className = "celula1";
    coluna1.innerHTML = document.servico.txtServicos.value;
    var coluna1 = linha.insertCell(-1);
    coluna1.className = "celula1";
    coluna1.innerHTML = document.servico.txtValorServico.value;

 document.getElementById('txtServicos').value='';
 document.getElementById('txtValorServico').value='';
}
function LimpaTabelaServicos(){
    var table1 = document.getElementById("tabela2");
    totLinhas = table1.rows.length - 1;
    for(i=1;i<totLinhas;i++){
        table1.deleteRow(1);
    }
 document.getElementById('txtServicos').value='';
 document.getElementById('txtValorServico').value='';

    obj = document.getElementById('divTabelaServicos');
    if (obj.style.display == "block")
            obj.style.display = "none";
}
</script>

<div id="divConsulta" style="display: block">
    <table border="1" width="90%">
        <tr>
              <th colspan="3" class="thFundoazulLetrabranca" align="left">Entre com a descrição da mão de obra utilizada no serviço</th>
          </tr>
            <tr>
        <th class="thFundoazulLetrabranca">Escolha o Serviço:</th>
        <th class="thFundoazulLetrabranca">Valor:</th>
        <th class="thFundoazulLetrabranca"></th>
           </tr>
           <tr>
           <td><select name="txtServicos" id="txtServicos" style="margin-left:3px; width:400px;">
                         <option value="">Selecione</option>
                        <option value="Instalação Insul-film carro 4 portas">Instalação Insul-film carro 4 portas</option>
                        <option value="Instalação Insul-film carro 2 portas">Instalação Insul-film carro 2 portas</option>
                        <option value="Instalação alarme">Instalação alarme</option></td>

                <td><input type="text" name="txtValorServico"  id="txtValorServico" style="width=100px" onFocus="this.style.backgroundColor='#FFFBDD'" onblur="this.style.backgroundColor=''"></td>
                <td><input type="button" name=""  id=""  style="width=100px;" onclick="AddLinhaServico()" value="incluir serviço" />
          </tr>
    </table>

<div id="divTabelaServicos" style="display:none">
    <table id="tabela2">
      <tr>
      <th style="width:320px;background-color='#E8E8E8'">Serviço</th>
      <th style="width=100px;background-color='#E8E8E8'">Valor</th>
    </tr>
    <tr>
            <td style="background-color='#E8E8E8'">Valor total da mão de obra utilizada</td>
             <td><input type="text" name="txtTotProd"  id="txtTotProd" style="width=100px;background-color='#E8E8E8'"></td>
      <td><input type="button" name=""  id=""  style="width=100px;"  onclick="LimpaTabelaServicos()" value="Limpa Tabela" />
    </tr>
  </table>
</div>
</div>
</form>
</html>
</body>

Link para o comentário
Compartilhar em outros sites

  • 0

function RemoveLinhaServico(objeto) {
   tabela = document.getElementById("tabela2");
   if(objeto)
      tabela.deleteRow(objeto.parentNode.parentNode.rowIndex);
}

agora é só você acrescentar um botão ao final de cada linha e chamar a função assim: onClick="RemoveLinhaServico(this)"

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,8k
×
×
  • Criar Novo...