que estoy haciendo mal con este ajax y formulario?

[destor77]

Hola,
estoy intentando devolver por ajax el resultado de los datos enviados desde un formulario, pero no logro hacerlo,
el formulario es asi:

Código HTML:

<form action="#" method="post" id="suma" onsubmit="submitAjax('suma','index.php?controlador=index&amp;accion=tabla','tabla',0);" class="form label-inline" enctype="multipart/form-data">
        <div class="portlet portlet-closable">
 
        <div class="portlet-header">
            <h4>Venta Actual</h4>
 
        </div> <!-- .portlet-header -->
 
        <div class="portlet-content">
 
            <div id="inline-form">
 
            <div class="field">
                <div class="ui-widget">
                <label for="producto">Nombre Producto: </label>
                <input id="producto" name="producto" class="medium"/>
                <span><strong>Cantidad: </strong></span>
                <input id="cantidad" name="cantidad" size="4" type="text" class="xsmall" />
                <button type="submit"><span>Sumar</span></button>
                </div>
                
            </div>
            
            <div class="buttonrow">
                <input type="hidden" name="id_user" value="<?php echo $datos->id_user;?>"/>
                <button type="submit"><span>Cerrar Venta</span></button>
            </div>
 
            </div> <!-- #horizontal-form -->
            <div id="tabla">
            
            </div>
 
 
        </div> <!-- .portlet-content -->
 
        </div> <!-- .portlet -->
 
    </form>
 

el js es asi:

Código Javascript:

// funcion ajax para cargar contenido en un contenido especifico por GET
function requestAjax(link,param,valor,contenedor,visible){
    var url ;
    url = link;
    if(param!=''){
    url = url+"&"+param;
    }
    if(valor!=''){
    url = url+'='+valor;
    }
    $.ajax({
    url: url,
    cache: false,
    success: function(html){
        //alert(url);
        $("#"+contenedor).empty();
        $("#"+contenedor).append(html);
        if(visible==1){
        $("#"+contenedor).css('display','block');
        }
    }
    });
 
}
 
//funcion ajax para cargar contenido enviado por un formulario.
function submitAjax(idForm,link,contenedor,visible){
   var url;
    url = link + '&'+ $("#"+idForm).serialize();
    $.ajax({
    url: url,
    cache: false,
    success: function(html){
        $("#"+contenedor).empty();
        $("#"+contenedor).append(html);
        if(visible==1){
        $("#"+contenedor).css('display','block');
        }
    }
    });         
}
 

y la funcion php que es enviada a la url por ejemplo sitio.com/index.php?controlador=index&accion=tabla&producto= algo&cantidad=12&id_user=1
es la siguiente:

Código PHP:

public function tabla(){
        $prod = $this->Productos->listadoProductos();
        $tabla .= "<p> los datos enviados son:<br/>".$_REQUEST['producto']."-".$_REQUEST['cantidad']."-".$_REQUEST['id_user']."</p>";
        $tabla .= "<table>
            <tr>
            <td>Nombre</td>
            <td>Precio Lista</td>
            <td>Precio</td>
            </tr>
        ";
        for($i=0;$i<count($prod);$i++){
        $tabla .= "
            <tr>
                <td>{$prod[$i]['nombre']}</td>
                <td>{$prod[$i]['precio_lista']}</td>
                <td>{$prod[$i]['precio']}</td>
            </tr>";
        }
        $tabla .= "</table>";
 
        echo $tabla;
    }
 

el tema es que me pasa bien la url, pero no me imprime la tabla, como que no entrara al ajax, como puedo solucionarlo?

desde ya muchas gracias