PHP从div

时间:2018-08-01 06:21:21

标签: javascript php html

我在html中有类似的内容

<div id="files" class="files"></div>

Javascript动态添加

<p>File Name</p>

文件上传时。 PHP

<?php
 if(isset($_POST['add_task'])){
   $req_fields = array('area-id','jig-id','description','frequency-id');
   validate_fields($req_fields);
   if(empty($errors)){
     $t_area_id  = remove_junk($db->escape($_POST['area-id']));
     $t_jig_id  = remove_junk($db->escape($_POST['jig-id']));
     $t_description  = remove_junk($db->escape($_POST['description']));
     $t_frequency   = remove_junk($db->escape($_POST['frequency-id']));
     $date    = remove_junk($db->escape($_POST['date-done']));
     if ($_GET['file'])
        $file_name = $_GET['file'];
    else
        $file_name = "No File";
     $query  = "INSERT INTO tpm_tasks_list ("; 
     $query .=" area_id,jig_id,description,frequency,filename,last_date";
     $query .=") VALUES (";
     $query .=" '{$t_area_id}','{$t_jig_id}','{$t_description}' ,'{$t_frequency}','{$file_name}', '{$date}'";
     $query .=")";
     if($db->query($query)){
       $session->msg('s',"Task added ");
       redirect('add_task.php', false);
     } else {
       $session->msg('d',' Sorry failed to add!');
       redirect('add_task.php', false);
     }

   } else{
     $session->msg("d", $errors);
     redirect('add_task.php',false);
   }

 }

?>

JS我正在使用准备好的脚本进行文件上传,因为我对JS / Java不好,所以我在某处找到了

<script>
/*jslint unparam: true */
/*global window, $ */
$(function () {
    'use strict';
    // Change this to the location of your server-side upload handler:
    var url = window.location.hostname === 'blueimp.github.io' ?
                '//jquery-file-upload.appspot.com/' : 'upload/server/php/';
    $('#fileupload').fileupload({
        url: url,
        dataType: 'json',
        done: function (e, data) {
            $.each(data.result.files, function (index, file) {
                $('<p/>').text(file.name).appendTo('#files');
            });
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $('#progress .progress-bar').css(
                'width',
                progress + '%'
            );
        }
    }).prop('disabled', !$.support.fileInput)
        .parent().addClass($.support.fileInput ? undefined : 'disabled');
});
</script>

在同一页面上,我有一个表单,该表单将信息发送到mysql。 我需要获取该文件名(如果存在),并以某种方式将其与其他信息一起传递给php。

我发现的唯一一件事是使用DomDocument,但是我不认为我知道如何保存当前的html结构(上传文件)并将其传递给xml吗?

我还发现我可以将文件名传递给url,但这会刷新不需要的页面。

有什么建议吗?

1 个答案:

答案 0 :(得分:2)

如果您要提交表单以及使用ajax技术所需的其他必要信息,则无需刷新页面。在您的项目中包含jQuery,您可以执行如下ajax请求:

$("#idForm").submit(function(e) {
    var form = $(this);
    var file_data = $('#yourimage').prop('files')[0];
    var form_data = new FormData();
    form_data.append('file', file_data); // add other form elements

    $.ajax({
        url: 'upload.php', // point to server-side PHP script 
        dataType: 'text', // what to expect back from the PHP script, if anything
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,
        type: 'post',
        success: function(php_script_response) {
            alert(php_script_response); // display response from the PHP script, if any
        }
    });

    e.preventDefault(); // avoid to execute the actual submit of the form.
});

Upload.php是服务器端脚本,它将处理表单请求并根据您的情况返回响应。这样您就可以获得文件名和其他附加到表单数据的数据。