Use Chrome browser, open up the developer tools and the network tab. Then look to see if you get a response from the ajax call.

@iveybank - I don't think I'm getting one I don't see anything I'm not sure if maybe it's because once I hit submit then it goes to the index.blade.php

@Shiva ok took a look at the source of your page. You're javascripts are all over the place. Most importantly, they're loaded before the actual dom elements that you're referencing.

Try changing things so that all of this stuff is loaded just before your closing </body> tag:

        <!-- SCRIPTS -AT THE BOTOM TO REDUCE THE LOAD TIME-->
        <!-- JQUERY SCRIPTS -->

        <script src="http://localhost/testing/js/jquery-1.10.2.js"></script>

        <script src="http://localhost/testing/js/tinymce/tinymce.min.js"></script>

        <script src="http://localhost/testing/js/bootstrap.min.js"></script>

        <script src="http://localhost/testing/js/jquery.metisMenu.js"></script>

        <script src="http://localhost/testing/js/morris/morris.js"></script>

        <script src="http://localhost/testing/js/jquery.uploadfile.js"></script>

        <script src="http://localhost/testing/js/custom.js"></script>
        
        <script src="http://localhost/testing/js/jquery.knob.js"></script>

        <script src="http://localhost/testing/js/jquery.ui.widget.js"></script>

        <script src="http://localhost/testing/js/jquery.iframe-transport.js"></script>

        <script src="http://localhost/testing/js/jquery.fileupload.js"></script>

        <script src="http://localhost/testing/js/script.js"></script>


        <script type="text/javascript">
        tinymce.init({
            selector: "textarea"
         });
        </script>

        <script src="http://localhost/testing/js/test.js"></script>

        <script type="text/javascript">
            var settings = {
                url: 'http://localhost/testing/upload/upload.php',
                dragDrop:true,
                multiple : true,
                showFileCounter:false,
                showDone: false,
                fileName: "myfile",
                allowedTypes:"jpg,png,gif,pdf", 
                returnType:"json",
                showDelete:true,
            }
        </script>
        
    </body>
</html>

@sitesense - I added all the js to the bottom of the page but it caused some problems where the upload button wouldn't show. So I left

{{ HTML::script('js/jquery-1.10.2.js') }}
{{ HTML::script('js/jquery.uploadfile.js') }}

in the head section and I left

{{ HTML::script('js/test.js') }}
    <script type="text/javascript">
        var settings = {
                    url: '{{ asset("upload/upload.php") }}',
                    dragDrop:true,
                    multiple : true,
                    showFileCounter:false,
                    showDone: false,
                    fileName: "myfile",
                    allowedTypes:"jpg,png,gif,pdf", 
                    returnType:"json",
                    showDelete:true,
                }
    </script>

in the create.blade.php.

after doing that I ended up getting the alert you had asked me to put in my test.js and I got this

http://localhost/testing/admin/users

but the image still didn't show when I do dd($input)

Your {{ HTML::script('js/test.js') }} which contains the ajax stuff, really needs to be loaded last.

Apart from that, if the alert is saying http://localhost/testing/admin/users that's the wrong path I think. Shouldn't your ajax post to upload/upload.php?

The upload.php just makes the image upload to a folder it doesn't save it to the database

Ok, remember the alert, try changing that to alert($(".ajax-file-upload-filename").html()); and tell me what that says.

I get pupp_and_rabit.jpg which is the name of the file

We're getting somewhere... gimme a minute, brb.

Try replacing this:

$(this).find(".testing").each(function(){
            var image = [];
            $(this).parent().find(".ajax-file-upload-statusbar").each(function() {
                image.push($.trim($(this).find(".ajax-file-upload-filename").html()));
            });
            $(this).parent().find(".img-hidden").val(JSON.stringify(image));
        });

with this:

$(".img-hidden").val($(".ajax-file-upload-filename").text());

Does that work?

@sitesense - that worked. Thank you so much for the help. I appreciate it soooo much. I was really confused as to why it wasn't working and I think I got it now.

Glad it's working. That code needs a bit of tidying up though Shiva. I'm not even sure that you need the ajax call at all.

Anyway, that's for another day. I need to do some stuff. Good luck.