Dannybrazil Posted April 16, 2014 Share Posted April 16, 2014 Hello,I am not a JS developer so I hope someone here can help me.I got this code from the net: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script><script type="text/javascript" src="jquery.form.js"></script><script type="text/javascript">$(document).ready(function() {$('#photoimg').live('change', function(){ $("#preview").html('');$("#preview").html('<img src="images/loader.gif" alt="Uploading...."/>');$("#imageform").ajaxForm({target: '#preview'}).submit();});}); </script> This works perfectly for 1 image form but I want to have 4 forms (different images) on the same page and I want to get the same effect (page is not refreshing and images are uploaded to server).On jquery.form.js there is something that may help, but I dont know how to code it correctly: Usage Note: ----------- Do not use both ajaxSubmit and ajaxForm on the same form. These functions are intended to be exclusive. Use ajaxSubmit if you want to bind your own submit handler to the form. For example, $(document).ready(function() { $('#myForm').bind('submit', function(e) { e.preventDefault(); // <-- important $(this).ajaxSubmit({ target: '#output' }); }); }); Use ajaxForm when you want the plugin to manage all the event binding for you. For example, $(document).ready(function() { $('#myForm').ajaxForm({ target: '#output' }); }); When using ajaxForm, the ajaxSubmit function will be invoked for you at the appropriate time.*//** * ajaxSubmit() provides a mechanism for immediately submitting * an HTML form using AJAX. */ The HTML for the form: <form id="imageform" method="post" enctype="multipart/form-data" action="ajaximage_update.php"><input type="hidden" name="img" value="image_1" /><input type="hidden" name="row_id" value="<?=$rsi?>" /><div class="file-input-wrapper"> <button class="btn-file-input"><?=$button_text?></button> <input type="file" name="photoimg" id="photoimg" /></div></form><div id="preview"></div> What should I do in this case?I want to have 4 different forms on the page and each image would work using the JS. Link to comment Share on other sites More sharing options...
justsomeguy Posted April 16, 2014 Share Posted April 16, 2014 It sounds like you need to give each of those sets of forms and other elements their own unique IDs, and then reference the IDs for each set in the jQuery code. 1 Link to comment Share on other sites More sharing options...
Dannybrazil Posted April 16, 2014 Author Share Posted April 16, 2014 OK got it....works now Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now