1

estoy trabajando en MVC y quiero enviar una imagen a través de Ajax con Jquery, he podido enviar datos de texto pero hasta ahora no sé cómo hacer para enviar la imagen, ya que cuando lo pongo a ver qué datos me envió me sale como nulo

Este es el codigo de mi formulario tengo un input file y un input text

    <input type="text" id="texto" />
    <input type="file" id="fot" />
    <input type="button" value="enviar" onclick="uploadAjax()" />

Este un mi function que es llamado del boton anterior, donde se encuentra mi ajax en el jalo los datos con el getelementbyid y los mando en un data

`

    <script>
        function uploadAjax() {
            var inputFileImage = document.getElementById("fot").value;
            var texto = document.getElementById("texto").value;
            alert(texto + inputFileImage);
            $.ajax({

                url: 'xd/',
                type: "POST",
                data: { texto: texto, imagen: inputFileImage }
            });
        }
    </script>`

El metodo del url es este debido a es mvc en c# uso un actionresult en el tengo dos parametros que son los que se reciben en el data, unicamente la variable texto me llega con un valor y el de HttpPostedFileBase sale como nula. En este caso solo quiero asegurarme de que se envien los datos porque lo voy aplicar en otro proyecto mas grandes, pero necesito el como enviar esa imagen

  public ActionResult xd(string texto, HttpPostedFileBase imagen)
    {

        string sum =  "holoa";

        return View();
    }

2 respuestas 2

1

Para enviar archivos por AJAX al servidor debes colocar las opciones contentType y processData en false y en vez de enviar un objeto en la opción data debes armar un objeto tipo FormData (XHR2).

Te dejo el link de referencia: https://developer.mozilla.org/es/docs/Web/Guide/Usando_Objetos_FormData

0

Quizas deberias evaluar

Send Images through ajax

hacer algo como

<script>
    function uploadAjax() 
    {
        var inputFileImage = $("#fot")[0];
        var texto = $("#texto").val();

        var formdata = new FormData(); 
        formdata.append("image", inputFileImage);
        formdata.append("texto", texto);

        $.ajax({
            url: 'xd/',
            type: "POST",
            data: formdata,
            processData: false,
            contentType: false,
            success:function(){
                //aqui codigo
            }
        });
    }
</script>

como selector usa jquery

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.