terça-feira, 17 de janeiro de 2012

Edição HTML com AJAX

O estilo apresentado abaixo permite a edição de um campo em uma página HTML, ou seja, permite a edição em uma página de relatório.


HTML 
<input
name="" 
onchange="javascript:ajaxCampoResposta(this.value,1,5 )" 

value="teste"
style="width: 100%; background: none repeat scroll 0% 0% transparent; border: 0px none;"

onmouseout="this.style.border="0px none""

onmouseover="this.style.border="1px solid #000000""

maxlength="255"

onkeyup=" { document.getElementById("botao_salvar").style.display="";document.getElementById("botao_cancelar").style.display="";this.parentNode.parentNode.firstChild.firstChild.title="*";} this.value = this.value.replace(/\d/g,"").toUpperCase();"
>


JavaScript - Codigo JavaScript que faz chamada para um Ajax de atualização de Campo.


function ajaxCampoResposta(oiac_objeto, id_dicionario, id)
{
 /*
 alert(oiac_objeto+campo);
 return true;
 //*/
 var xmlHttp;
 try
 {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
 }
 catch (e)
 {
  // Internet Explorer
  try
  {
   xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
  catch (e)
  {
   try
   {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   catch (e)
   {
    alert("Seu navegador não suporta AJAX!");
    return false;
   }
  }
 }
 xmlHttp.onreadystatechange=function()
 {
  if(xmlHttp.readyState==4)
  {
   // document.getElementById("resultado_ajax").innerHTML=xmlHttp.responseText;
   //alert("Kadu");
   alert(xmlHttp.responseText);
  }
 }
 xmlHttp.open("GET","tab_seletor_campos_ajax_resposta.php?p_conteudo="+escape(oiac_objeto)+'&id_dicionario='+id_dicionario+'&id='+id,true);
 xmlHttp.send(null);
}


Nenhum comentário: