Question

我正在尝试将两种不同的表单代码结合使用以满足我的需求

我使用了本教程 http://www.sanwebe.com/2011/12/making-simple-jquery-ajax-contact-form/comment-page-1 创建联系表单

现在我需要一份实习申请表，其中包括附上简历的选项。

我非常喜欢我使用的表单上的ajax的功能，但它没有显示如何将上传添加到电子邮件中。

本教程显示.. http://designbyelle.com.au/journal/2008/04/23/php-mailer-form-with-file-attachment/

我正在尽力将它们结合起来。我必须将后者合并到前者的php中并使用后者的电子邮件技术。

问题：

ajax表单基于输入数据，但附件表单说我们需要 FORM元素，因为我们需要添加method="post" enctype="multipart/form-data">

我尝试将字段集转换为表单，但后来脚本ajax脚本没有显示。如何在不更改字段集的情况下解决此问题

简单来说，我如何在字段集表单中获取method="post" enctype="multipart/form-data">。

AJAX表格的脚本

    <script type="text/javascript">
    $(document).ready(function() {
        $("#send_btn").click(function() { 
            //collect input field values
            var intern_name       = $('input[name=name]').val();
            var intern_city       = $('input[name=city]').val();
            var intern_program    = $('input[name=program]').val();   
            var intern_portfolio  = $('input[name=portfolio]').val(); 
            var intern_experience = $('input[name=experience]').val(); 
            var intern_filename   = $('input[name=filename]').val(); 
            var intern_email      = $('input[name=email]').val();
            var intern_phone      = $('input[name=phone]').val();

            //simple validation at client's end
            //we simply change border color to red if empty field using .css()
            var proceed = true;
            if(intern_name==""){ 
                $('input[name=name]').css('border-color','red'); 
                proceed = false;
            }
            if(intern_city==""){ 
                $('input[name=city]').css('border-color','red'); 
                proceed = false;
            }
            if(intern_program==""){ 
                $('input[name=program]').css('border-color','red'); 
                proceed = false;
            }
            if(intern_portfolio==""){ 
                $('input[name=portfolio]').css('border-color','red'); 
                proceed = false;
            }
            if(intern_filename==""){ 
                $('input[name=filename]').css('border-color','red'); 
                proceed = false;
            }
            if(intern_email==""){ 
                $('input[name=email]').css('border-color','red'); 
                proceed = false;
            }
            if(intern_phone=="") {    
                $('input[name=phone]').css('border-color','red'); 
                proceed = false;
            }


            //everything looks good! proceed...
            if(proceed) 
            {
                //data to be sent to server
                post_data = {'internName':intern_name, 'internCity':intern_city,   'internProgram':intern_program,  'internPortfolio':intern_portfolio,  'internEexperience':intern_experience,  'internFilename':intern_filename, 'internEmail':intern_email, 'internPhone':intern_phone};

                //Ajax post data to server
                $.post('intern_me.php', post_data, function(data){  

                    //load success massage in #internresult div element, with slide effect.       
                    $("#internresult").hide().html('<div class="success">'+data+'</div>').slideDown();

                    //reset values in all input fields
                    $('#intern_form input').val(''); 
                    $('#intern_form textarea').val(''); 

                }).fail(function(err) {  //load any error data
                    $("#internresult").hide().html('<div class="error">'+err.statusText+'</div>').slideDown();
                });
            }

        });

        //reset previously set border colors and hide all message on .keyup()
        $("#intern_form input, #intern_form textarea").keyup(function() { 
            $("#intern_form input, #intern_form textarea").css('border-color',''); 
            $("#internresult").slideUp();
        });

    });
    </script>

这是html的开头

    <fieldset id="intern_form">
                  <label for="name"><span>Name</span>
                    <input type="text" name="name" id="name" placeholder="Enter Your Name" />
                  </label>

我希望有人可以帮助我。当我测试这两个以将它们组合在一起时，我将需要更多的帮助。但是现在这是我的问题。如何在场集上使用multipart

Answer 1

我可能会远离试图将enctype放到场地上。只需将您现有的内容包装在标记内即可。另外，这是完成它的正确方法。

以下是我如何设置HTML

<form id="intern_form" method="POST" action"path/to/php/" enctype="multipart/form-data">
 <fieldset>
  <label for="name">Name</label>
  <input type="text" name="name" id="name" placeholder="Enter Your Name" />
 </fieldset>
</form>

Php / Ajax - 上传包含MAIL表格

1 个答案: