Krajee Bootstrap File Wrong Answer

I am trying to use this plugin and I am not getting anything when I click the submit button on the form.

This is the form inside the modal. I am using bootstrap.

    <form id="myForm" action="#" method="post" enctype="multipart/form-data">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true" id="closeModalTimes">
            &times;
            </button>
            <h4 class="modal-title">Upload New Document</h4>
        </div>
        <div class="modal-body">
            <div class="row">
                <div class="col-md-12">
                    <div class="form-group">
                        <label class="control-label">Name *</label>
                        <input class="form-control" type="text" id="name" name="name" required />
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="form-group">
                        <label class="control-label">Subject *</label>
                        <textarea name="subject" id="subject" class="form-control" required></textarea>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="form-group">
                        <label for="inputFile">Document File *</label>
                        <input type="file" name="inputFile" id="inputFile" required>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" data-dismiss="modal" class="btn" id="closeModalButton">
            Close
            </button>
            <button type='button' id="submitFile" class='btn'>
                Send
            </button>
        </div>
    </div><!-- /.modal-content -->
    <input name="myId" type="hidden" id="myId" value="393839334034933">
    <input name="user" type="hidden" id="user" value="339">
    <input name="page" type="hidden" id="page" value="test">
    </form>

      

This is jquery at the bottom of the page

$("#inputFile").fileinput({
    overwriteInitial: false,
    maxFileSize: 4000,
    showPreview: false,
    showUpload: false,
    uploadAsync: true,
    allowedFileExtensions: ["jpg", "jpeg", "gif", "png"],
    browseClass: "btn btn-info",
    elErrorContainer: "#documentErrorBlock",
    msgSizeTooLarge: "File exceeds size",
    msgInvalidFileExtension: "Invalid extension",
    uploadURL: "upload.php",
    uploadExtraData: function() {
        return {
                id: $("#myId").val(),
                userId: $("#user").val(),
                page: $("#page").val(),
                name: $("#name").val(),
                subject: $("#subject").val()
            };
    }
});


$('#inputFile').on('filebatchuploadsuccess', function(event, data, previewId, index) {
    alert('success: '+data.response);
});

$('#inputFile').on('filebatchuploaderror', function(event, data, previewId, index) {
    alert('error: '+data.response);
});

$("#submitFile").click(function(e) {
    $('#inputFile').fileinput('upload');
});

      

And this is the PHP file:

$output = array();
$output['message'] = 'Reached PHP';
$output['success'] = true;
echo json_encode($output);

      

When I click nothing happens at all ... no error message or anything else ... Thanks for your help!

+3


source to share


1 answer


The reason for not submitting came from your "uploadURL", which is incorrectly specified according to the documentation. Change this

uploadURL: "upload.php",

      

to



uploadURL: "upload.php",

      

which solves your problem.

http://plugins.krajee.com/file-input#option-uploadurl

+1


source







All Articles