add input e eviar para o BD

11closed · Abril 26, 2010

ola

Bom 1º de tudo obrigado Thiago Retondar pelo script, muito bom.

to com um scripts do Thiago Retondar aq, fis umas alterações, é um script que add campos e botões.

bom ele esta add tudo certinho, mais eu quero enviar os valores dos campos para o BD com ajax(Sem atualizar a pagina). olha o codigo

window.onload = function(){ 
 start(); // esse start é de outro window.onload outro script
 addRemoveInput("upload", "btnAdd", "Deletar Campo!", 50, 1, "Preço ");
};
function addRemoveInput(formId, buttonAdd, textButtonRemove, maxInputs, minInputs, textLabel){  
  
 var form = document.getElementById(formId);    	
 var btnAdd = document.getElementById(buttonAdd);    	
 var inputs = 0;    	
 var labels = document.getElementsByTagName("label");            	
 btnAdd.onclick = addInput ;            	
 function addInput(){            	
  if(labels.length < maxInputs){                    	
   ++inputs;
   var label = document.createElement("label");                    	
   var input = document.createElement("input");
   var inputData = document.createElement("input");
   var btnRemove = document.createElement("input");
   var gravar = document.createElement("input");
   label.innerHTML =  textLabel;
   input.setAttribute("type", "text");  	
   input.setAttribute("value", "no(a) Nome da Data");
   input.setAttribute("name", "add"+inputs+"P");
   inputData.setAttribute("type", "text");  	
   inputData.setAttribute("value", "00/00");
   inputData.setAttribute("name", "addData"+inputs+"P");
   btnRemove.setAttribute("type", "button");                    	
   btnRemove.setAttribute("value", textButtonRemove);
   gravar.setAttribute("type", "button");
   gravar.setAttribute("name", "addbotao"+inputs+"P");   
   gravar.setAttribute("value", "Gravar");

   label.appendChild(input);
   label.appendChild(document.createTextNode(" por pessoal. Dia/Mes "));   
   label.appendChild(inputData);
   
   
    if(labels.length < minInputs){ 
     form.appendChild(label);  
     label.appendChild(gravar);
    } else{                            	
     label.appendChild(btnRemove); 
     label.appendChild(gravar);
     form.appendChild(label);                    	
    }                    	
    btnRemove.onclick = removeInput; 
    gravar.onclick = GravarInput;
  } else alert("Você pode adicionar até " + maxInputs + " campos!");    	
 }    	
 function removeInput(){            	
  if(labels.length == minInputs + 1){                    	
   inputs--;                    	
   // alert("Você deve deixar no mínimo " + minInputs + " campo(s)!");                    	
   form.removeChild(this.parentNode);            	
  } else{                    	
   inputs--;                    	
   form.removeChild(this.parentNode);            	
  }    	
 }
 function GravarInput(){
 
 }
}

<div id='diariaPORpessoal' style='visibility:hidden;'>
        Adicionar uma Data :<input type='button' value='Adicionar Campo!' id='btnAdd' name='btnAdd' />
    <div id='upload'>

    </div>
</div>

EX: se eu add um campo ele ira criar assim dentro da div "upload"

<label>Preço <input type="text" value="no(a) Nome da Data" name="add2P"> por pessoal. Dia/Mes <input type="text" value="00/00" name="addData2P"><input type="button" value="Deletar Campo!"><input type="button" name="addbotao2P" value="Gravar"></label>

quando eu clicar no botão gravar eu gostaria que verificace no BD se à um campo com o nome add2P e outro com o addData2P e outro com o add2precoP se existir insere no campo os seguintes dados

add2P "Preço'value do add2P' por pessoal"

addData2P value do addData2p

add2precoP "aq vazil so pra cria um campo caso ñ ter.."

e se caso ñ existir os campos cria e depois insere os dados..

ai aparece uma menssagem depois do botão "gravar" Data gravada"!!!

alguem sabe onde tem um script com ex: de como eu posso fazer isso ?

t+

opa desculpa

a linha

var inputs = 0;

é

var inputs = 1;

t+

ola galera, desculpe mais acho que alguem me entendeu errado colocarão esse topico como Resolvido (ele ainda ñ ta resolvido)..XD

aindei fusando para tentar resolver, achei um cadastro em ajax e JQUERY estou tentando juntar os scripts

fis umas mudanças

olha os codigos

aq esta criando os input e os botoes e o span para mostrar o resultado do envio para o BD

window.onload = function(){ 
 start();
 addRemoveInput("upload", "btnAdd", "Deletar Campo!", 50, 1, "Preço");
};
function addRemoveInput(formId, buttonAdd, textButtonRemove, maxInputs, minInputs, textLabel){  
  
 var form = document.getElementById(formId);    	
 var btnAdd = document.getElementById(buttonAdd);    	
 var inputs = 1;    	
 var labels = document.getElementsByTagName("label");            	
 btnAdd.onclick = addInput ;            	
 function addInput(){            	
  if(labels.length < maxInputs){                    	
   ++inputs;
   var label = document.createElement("label");
   var result = document.createElement("span");   
   var input = document.createElement("input");
   var inputData = document.createElement("input");
   var btnRemove = document.createElement("input");
   var gravar = document.createElement("input");
   //var span = document.createElement("span");
   label.innerHTML =  textLabel;
   input.setAttribute("type", "text");  	
   input.setAttribute("value", "no(a) Nome da Data");
   input.setAttribute("name", "add"+inputs+"P");
   inputData.setAttribute("type", "text");  	
   inputData.setAttribute("value", "00/00");
   inputData.setAttribute("name", "addData"+inputs+"P");
   btnRemove.setAttribute("type", "button");                    	
   btnRemove.setAttribute("value", textButtonRemove);
   gravar.setAttribute("type", "button");
   gravar.setAttribute("name", "addbotao"+inputs+"P");   
   gravar.setAttribute("value", "Gravar");
   result.setAttribute("id", "result"); 
   result.id = "resposta"+inputs+"";

   label.appendChild(input);
   label.appendChild(document.createTextNode(" por pessoal: Dia/Mes: "));   
   label.appendChild(inputData);
   
   //document.getElementById("result").appendChild(span);
   
   
    if(labels.length < minInputs){ 
     form.appendChild(label);  
     label.appendChild(gravar);
     label.appendChild(result);
    } else{                            	
     label.appendChild(btnRemove); 
     label.appendChild(gravar);
     form.appendChild(label);
     label.appendChild(result);     
    }                    	
    btnRemove.onclick = removeInput; 
  } else alert("Você pode adicionar até " + maxInputs + " campos!");    	
 }    	
 function removeInput(){            	
  if(labels.length == minInputs + 1){                    	
   inputs--;                    	
   // alert("Você deve deixar no mínimo " + minInputs + " campo(s)!");                    	
   form.removeChild(this.parentNode);            	
  } else{                    	
   inputs--;                    	
   form.removeChild(this.parentNode);            	
  }    	
 }
}

cadastro, aq esta buscando a pagina JQUERY e criando um codigo para mandar para enviar.php, a function(data) é o resultado para inserir no BD.

<script src="scripts/jquery-1.4.2.js" type="text/javascript"></script>
 <script type="text/javascript">
$(document).ready(function() {
 $("#addbotao2P").click(function() {
  var add2P = $("#add2P");
  var add2PPost = add2P.val();
  var addData2P = $("#addData2P");
  var addData2PPost = addData2P.val();
  $.post("enviar.php", {add2P: add2PPost, addData2P: addData2PPost},
   function(data){
    $("#resposta2").html(data);
   }
  , "html");
 });
});
</script>

ainda na cadastro, aq é os campos HTML, a div upload é aonde aparece todos os inputs para preencher e enviar para o BD.

<div id='diariaPORpessoal' style='visibility:hidden;'>
Adicionar uma Data :<input type='button' value='Adicionar Campo!' id='btnAdd' name='btnAdd' />
    <div id='upload'>
    </div>
</div>

e a enviar.php, aq é a pagina php que grava os dados no BD

<?php
// recebo os campos via $_POST[''];
$add2P = $_POST['add2P'];
$addData2P = $_POST['addData2P'];
 
// verifico se estão preenchidos
if (!($add2P) || !($addData2P)){
echo 'Preencha os dois campos!';
exit();
}
//Abrindo Conexao com o banco de dados
$conexao = mysql_pconnect("localhost", "root", "") or die (mysql_error());
$banco = mysql_select_db("localfasil");
 
//Utilizando o  mysql_real_escape_string voce se protege o seu código contra SQL Injection.
$add2P = mysql_real_escape_string($add2P);
$addData2P = mysql_real_escape_string($addData2P);
 
$insert = mysql_query("insert into  anuncia_local_apart1 (add2P,addData2P) values ('{$add2P}','{$addData2P}')");
mysql_close($conexao);
if($insert) {
echo 'Cadastro Realizado!';
}else {
echo 'Erro ao Cadastrar!';
}
?>

bom é o seguinte, quando eu aperto o botão gravar ñ acontece nada... era pra ta inserindo no BD e esta mostrando um resultado em ajax dentro do span id="result"

porque sera que ñ deu certo

oq eu tenho q fazer ?

t+

Thiago Retondar · Abril 26, 2010

Vou o tópico para o sub-fórum de AJAX.

O browser te mostra algum erro?

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

11closed · Abril 29, 2010

OK

ola Thiago Retondar

ñ ele ñ mostra !!

t+

ola

tentei fazer uns debug na envia mais parece que a leitura ñ esta chegando aq

$(document).ready(function() {
 $("#addbotao2P").click(function() {
  var add2P = $("#add2P");
  var add2PPost = add2P.val();
  var addData2P = $("#addData2P");
  var addData2PPost = addData2P.val();
  
  $.post("enviar.php", {add2P: add2PPost, addData2P: addData2PPost},
   function(data){
    $("#resposta2").html(data);
   }
  , "html");
 });
});

sera que eu tenho que colocar algo como o "deletar campo" aq

btnRemove.onclick = removeInput;

    
  } else alert("Você pode adicionar até " + maxInputs + " campos!");    	
 }    	
 function removeInput(){            	
  if(labels.length == minInputs + 1){                    	
   inputs--;                    	
   // alert("Você deve deixar no mínimo " + minInputs + " campo(s)!");                    	
   form.removeChild(this.parentNode);            	
  } else{                    	
   inputs--;                    	
   form.removeChild(this.parentNode);            	
  }    	
 }

ex: gravar.onclick = blablabla;

function blablabla {

ñ estou conseguindo de jeito nenhum

help-me .... XD

t+

William Bruno · Abril 30, 2010

esse trecho aqui:

var add2P = $("#add2P");
  var add2PPost = add2P.val();
  var addData2P = $("#addData2P");
  var addData2PPost = addData2P.val();

esta incorreto. Melhor seria:

var add2P = $("#add2P").val();
  var addData2P = $("#addData2P").val();

11closed · Abril 30, 2010

ola

mudei aq mais nd aconteceu fiquei o dia todo tentando fazer funcionar, mais nd ....

assim ñ ta dano certo, alguem pode me da uma luz aew e me mostrar outras formas de fazer isso?

tipo os inputs estão criando certinho, so na hora de enviar para o BD que ñ esta dano certo, preciso arrumar o botão gravar.

sabe ñ sei direito mais algo assim

btnRemove.onclick = removeInput;
gravar.onclick = gravando;

} else alert("Você pode adicionar até " + maxInputs + " campos!");    	
 }    	
 function removeInput(){            	
  if(labels.length == minInputs + 1){                    	
   inputs--;                    	
   // alert("Você deve deixar no mínimo " + minInputs + " campo(s)!");                    	
   form.removeChild(this.parentNode);            	
  } else{                    	
   inputs--;                    	
   form.removeChild(this.parentNode);            	
  }    	
 }
 function gravando(){            	
// aq a função que verivica e grava os inputs criados, entenderam?
}

t+

William Bruno · Abril 30, 2010

humm ? :huh:

não entendi.. trabalhe com arrays,

<input type="text" name="tal[]" />

e faça um serialize()(método jQuery) do form para enviar via POST com o método $.post.

Entrar

Arquivado

add input e eviar para o BD

Recommended Posts

11closed 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Thiago Retondar 18

Compartilhar este post

Link para o post

Compartilhar em outros sites

11closed 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

11closed 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Este projeto é apoiado pelas empresas

Fóruns

Tempo Real

Informação importante