input que cambie su valor con flechas

[franshow]

Estimados estoy realizando un proyecto php y estoy topando en algo que probablemente lo pueda solucionar con ajax:

lo que ocurre es que tengo que hacer un input en el cual voy a manejar cantidades de productos pero sin embargo necesito que este input tenga flechas, si apreto la flecha de arriba aumente uno, si apreto la flecha de abajo decremente en menos uno

alguna idea compañeros??


Saludos



de ante mano muchas gracias

[kh0d3x]

No soy un experto en programación, pero lo que creo que necesitas es obviamente con Ajax ó Javascript y actualize mediante ajax.

La estrutucturación sería que en cuanto den click en la "imagen de la fecha arriba" se haga un "UPDATE" a la database aumentando el valor +1, la parte SQL creo que no tendrías problemas ... UDPATE x set y ... id=z.

Para lo de ajax yo recien estoy comenzando, pero podrías utilizar esto:
http://www.ribosomatic.com/articulos/ajax-php-mysql-consulta-de-registros/

Lo cual al enviar un valor a la sql te "actualiza" los datos en pantalla automáticamente.

Ó por otro lado, yo lo que hago es digamos sería meter dos form uno para el UP y otro para el DOWN (las flechas) en donde arriba represente un valor sumatorio y abajo uno para restar, lo proceso con php y muestro con ajax, por ejemplo, este es mi codigo ajax:

ajax1.js (me refresca el div):

Código Javascript:

function creaAjax(){
  var objetoAjax=false;
  try {
   objetoAjax = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
   try {
     /*Para explorer*/
     objetoAjax = new ActiveXObject("Microsoft.XMLHTTP");
     } 
     catch (E) {
     objetoAjax = false;
   }
  }
 
  if (!objetoAjax && typeof XMLHttpRequest!='undefined') {
   objetoAjax = new XMLHttpRequest();
  }
  return objetoAjax;
}
 
 function insert (url,capa,valores,metodo)
{
    
   var ajax=creaAjax();
   var msginfo = document.getElementById(capa);
 if(metodo.toUpperCase()=='POST'){
    ajax.open (metodo, url, true);
    ajax.onreadystatechange = function() {
         if (ajax.readyState==1) {
                 msginfo.innerHTML="<p align='center'>Cargando...</p>";
         }
         else if (ajax.readyState==4){
            if(ajax.status==200)
            {
                document.getElementById('msg').innerHTML=ajax.responseText; 
            }
            else if(ajax.status==404)
                 {
 
                     //msginfo.innerHTML = "La direccion existe";
                 }
             else
                 {
                     //msginfo.innerHTML = "Error: ".ajax.status;
                 }
        }
    }
    ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    ajax.send(valores);
    return;
}
}
 

ajax2.js (me actualiza cada "x" tiempo);

Código Javascript:

function getXMLHttpRequest() {
    var aVersions = [ "MSXML2.XMLHttp.5.0","MSXML2.XMLHttp.4.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp","Microsoft.XMLHttp"];
    if (window.XMLHttpRequest) {
        // IE7, MOZILLA, ZAFARI
        return new XMLHttpRequest();
    }
    else if (window.ActiveXObject) {
        // ActiveX
        for(var i=0;i<aVersions.length;i++) {
            try {
                var oXmlHttp = new ActiveXObject(aVersions);
                return oXmlHttp;
            }
            catch(error) {
            }
        }
    }
}
 
var carg = '<p align="center">Cargando...</p>';
 
function reloadchat(div,chat) {
    var cont = document.getElementById(div);
    ajax = getXMLHttpRequest();
    ajax.onreadystatechange = function() {
        
        if(ajax.readyState == 4) {
            cont.innerHTML = ajax.responseText;
        }
    }
    ajax.open('POST', chat, true);
    ajax.send(null);
}
 
setInterval("reloadchat('msg','lib/show.lib.php');",1000);
 

El form del ajax1.js quedaría:

form method=\"POST\" onsubmit=\"insert('./lib/formcheck.lib.php','msg','user='+document.getEleme ntById('user').value+'&gomsg='+document.getEle mentById('gomsg').value+'&gopass='+document.ge tElementById('gopass').value,'POST'); return false\">

En donde declaro el archivo php, los valores y el metodo (POST o GET).

P.D. No es una respuesta muy aclarativa pero alomejor te da unas ideas.