Отправить Ajaxform при изменении

Question

У меня есть форма Ajax, которую мне нужно отправить, как только пользователь выбирает изображение. Проблема в том, что форма не отправляется. Пожалуйста, любое руководство будет оценен

--The форма ---

<form id="bgimageform" method="post" enctype="multipart/form-data" action="process.php"> 
    <div class="uploadFile timelineUploadBG"> 
     <input type="hidden" name = "bkg" value = "1"/> 
     <input type="file" name="photoimg" id="bgphotoimg" class="custom-file-input"> 

    </div> 

</form> 

--- The кода JS ---

<script src="js/jquery-1.7.1.min.js"></script> 
<script src="js/jquery.form.js"></script> 
<script src="/js/jquery-ui.min.js"></script> 
<script src="js/jquery.wallform.js"></script> 
<script> 
$(document).ready(function() { 

    /* Uploading Profile BackGround Image */ 
    $('body').on('change','#bgphotoimg', function() { 

    $("#bgimageform").ajaxForm({target:'#timelineBackground'}).submit(); 

    }); 
}); 
</script> 

Answer 1

Вы правы, что первая попытка была далеко ,

В любом случае, я провел несколько тестов, и кажется, что если вы это сделаете, это сработает.

$('body').on('change','#bgphotoimg', function() { 
    alert("It should have submitted."); 
}); 

Вот скрипка, демонстрирующая его. http://jsfiddle.net/gt9e160f/

Поэтому я должен был бы указать на ваш метод отправки, потому что на изменение, безусловно, называется.

Я никогда не использовал jquery.form.js раньше, но из их документы я вытащил это:

$(function(){ 

    //bind the form's submit to ajaxForm 
    $("body").on('submit', '#bgimageform', function(e){ 
     $(this).ajaxForm({target:'#timelineBackground'}); 
     e.preventDefault(); 
     return false; 
    }); 

    /* Uploading Profile BackGround Image */ 
    $('body').on('change','#bgphotoimg', function() { 
     //submit the form 
     $("#bgimageform").submit(); 
    }); 
}); 

Answer 2

попробовать этот

$("body").on('change','input#bgphotoimg', function() { 
    $('#bgimageform').submit(AjaxCall); 
}); 
function AjaxCall(){ 
    // ajax call here 
    $.ajax({ 
    type: "POST", 
    url: "url", 
    data: {}, 
    success: function(data) { 
     // code here 
     console.log(data); 
    } 
    }); 
    return false; 
}