报价表格提取数据但一旦提交就不会传递信息

时间：2014-07-30 17:27:28

标签： javascript html forms submit

在我的下面的代码中，我需要日期，产品名称和产品ID，不仅在按下引用按钮时被拉动，而且在提交表单时也会被传递。目前，当我们收到它们时，三个不会被发送到电子邮件中，只显示其他字段。我们需要显示所有信息。当您按下“获取报价”按钮并显示表单时，它们会显示，但是当用户提交表单时，前三个表单不会通过。如果有人有任何想法或可以帮助我，将不胜感激。谢谢。

<div id="quoteform">
<form name="eMail" method="post" action="/emailform.asp" class="clear" id="application">
    <div class="full-raw">
        <div class="titlequote">
            -GET A QUOTE-
        </div>
    </div>
    <div class="full-raw">
        <div class="smtextinstr">
        </div>
    </div>
    <div class="full-raw">
        <div class="titlehelp">
        For Help, Please Call</div>
    </div>
    <div class="controllswrapper">

<div class="full-raw reqtext">  
<div class="faq-content faq-content-more">
<div class="faq-contentimportant">
<b>IMPORTANT! Please Read Before Continuing</b>
</div>
<br/>
Get-A-Quote is for quoting one individual item only. If you would like a quote for more         than one item at a time, please click Add to Cart for each individual item. Then when you   are ready to submit your quote request, click "Checkout" in your cart window.
</div>


</div>
 </div>


        <div class="full-raw reqtext">
            <div class="cell-label">
Date:
            </div>
            <div class="cell-controls">
                <div class="dayfield"></div>
            </div>
</div>



<div class="full-raw reqtext">
            <div class="cell-label">
Product Name:
            </div>
            <div class="cell-controls">
                <div class="pname"></div>
            </div>
        </div>


<div class="full-raw reqtext">
            <div class="cell-label">
Product ID:
            </div>
            <div class="cell-controls">
                <div class="pid"></div>
            </div>
        </div>

        <div class="full-raw reqtext">              
        <div class="full-raw reqtext">
            <div class="cell-label">
Quantity:
                <span class="requireditem">*</span>
            </div>
            <div class="cell-controls">
<input type="text" value="1" maxlength="4" size="3"   id="Quantity" name="Quantity" class="required"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Full Name:
                <span class="requireditem">*</span>
            </div>
            <div class="cell-controls">
    <input type="text" id="FullName" name="FullName" class="required"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Title
                <span class="requireditem">*</span>
            </div>
            <div class="cell-controls">
    <input type="text" id="Title" name="Title" class="required"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Facility Name
                <span class="requireditem">*</span>
            </div>
            <div class="cell-controls">
    <input type="text" id="FacilityName" name="FacilityName" class="required"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Facility Description:
            </div>
            <div class="cell-controls">
                     <select name="FacilityDesc">
                 <option selected="">Please Select</option>
                 <option value="Commercial Real Estate">Commercial Real Estate</option>
                 <option value="Education">Education</option>
                 <option value="Healthcare">Healthcare</option>
                 <option value="Club/Entertainment">Club/Entertainment</option>
                 <option value="Government">Government</option>
                 <option value="GSA">GSA</option>
                 <option value="Food Service">Food Service</option>
                 <option value="Contractor">Contractor</option>
                 <option value="Industry">Industry</option>
                 <option value="Reseller">Reseller</option>
                            </select>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Shipping Address:
            </div>
            <div class="cell-controls">
    <input type="text" id="ShippingAddress" name="ShippingAddress"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
State / Province:
            </div>
            <div class="cell-controls">
                <select name="StateProvince">
                    <option selected="">Please Select</option>
                    <option value="AL">Alabama</option>
                    <option value="AK">Alaska</option>
                    <option value="AZ">Arizona</option>
                    <option value="AR">Arkansas</option>
                    <option value="CA">California</option>
                    <option value="CO">Colorado</option>
                    <option value="CT">Connecticut</option>
                    <option value="DE">Delaware</option>
                                   <option value="DC">District of Columbia</option>
                    <option value="FL">Florida</option>
                    <option value="GA">Georgia</option>
                    <option value="HI">Hawaii</option>
                    <option value="ID">Idaho</option>
                    <option value="IL">Illinois</option>
                    <option value="IN">Indiana</option>
                    <option value="IA">Iowa</option>
                    <option value="KS">Kansas</option>
                    <option value="KY">Kentucky</option>
                    <option value="LA">Louisiana</option>
                    <option value="ME">Maine</option>
                    <option value="MD">Maryland</option>
                    <option value="MA">Massachusetts</option>
                    <option value="MI">Michigan</option>
                    <option value="MN">Minnesota</option>
                    <option value="MS">Mississippi</option>
                    <option value="MO">Missouri</option>
                    <option value="MT">Montana</option>
                    <option value="NE">Nebraska</option>
                    <option value="NV">Nevada</option>
                    <option value="NH">New Hampshire</option>
                    <option value="NJ">New Jersey</option>
                    <option value="NM">New Mexico</option>
                    <option value="NY">New York</option>
                    <option value="NC">North Carolina</option>
                    <option value="ND">North Dakota</option>
                    <option value="OH">Ohio</option>
                    <option value="OK">Oklahoma</option>
                    <option value="OR">Oregon</option>
                    <option value="PA">Pennsylvania</option>
                    <option value="RI">Rhode Island</option>
                    <option value="SC">South Carolina</option>
                    <option value="SD">South Dakota</option>
                    <option value="TN">Tennessee</option>
                    <option value="TX">Texas</option>
                    <option value="UT">Utah</option>
                    <option value="VT">Vermont</option>
                    <option value="VA">Virginia</option>
                    <option value="WA">Washington</option>
                    <option value="WV">West Virginia</option>
                    <option value="WI">Wisconsin</option>
                    <option value="WY">Wyoming</option>
                    <option value="AB">Alberta</option>
                    <option value="BC">British Columbia</option>
                    <option value="MB">Manitoba</option>
                    <option value="NB">New Brunswick</option>
                    <option value="NL">Newfoundland</option>
                <option value="NT">Northwest Territories</option>
                    <option value="NS">Nova Scotia</option>
                    <option value="NU">Nunavut</option>
                    <option value="ON">Ontario</option>
                <option value="PE">Prince Edward Island</option>
                    <option value="QC">Quebec</option>
                    <option value="SK">Saskatchewan</option>
                    <option value="YT">Yukon</option>
                </select>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Country:
            </div>
            <div class="cell-controls">
                <select name="Country">
                    <option>United States of America</option>
                    <option>Canada</option>
                </select>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Zip Code:
            </div>
            <div class="cell-controls">
                <input type="text" name="ZipCode"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Phone:
                <span class="requireditem">*</span>
            </div>
            <div class="cell-controls">
    <input type="text" name="Phone" class="required phone"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Fax:
            </div>
            <div class="cell-controls">
                <input type="text" name="Fax" class="phone"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Email:
                <span class="requireditem">*</span>
            </div>
            <div class="cell-controls">
        <input type="text" id="email" name="email_From" class="required"/>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Taxable?:

            </div>
            <div class="cell-controls">
                <select name="Taxable">
                    <option></option>
                    <option>Yes</option>
                    <option>No</option>
                </select>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Have You Previously Purchased from Us?:
                <span class="requireditem">*</span>
            </div>
            <div class="cell-controls">
                <select name="PreviouslyPurchased" class="required">
                    <option></option>
                    <option>Yes</option>
                    <option>No</option>
                </select>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Special Instructions:

            </div>
            <div class="cell-controls">
    <textarea rows="3" cols="40" name="Special Instructions"  ></textarea>
            </div>
        </div>
        <div class="full-raw reqtext">
            <div class="cell-label">
Comments/Questions:

            </div>
            <div class="cell-controls">
    <textarea rows="3" cols="40" name="Comments / Questions" ></textarea>
            </div>
        </div>
    </div>
    <!--Remove all Hidden Inputs if No Captcha-->
<input type="hidden" name="email_To" value="placeemailhere"/>
<input type="hidden" name="email_Subject" value="Get A Quote Form Submission"/>
<input type="hidden" name="email_ThankYou" value="Thank you for submitting your request. We will be contacting you within 12 business hours with your requested quote."/>
    <input type="hidden" name="email_Redirect" value=""/>


<div class="verification_code">
                <div>
                    $(Verification_Image)<br/>
<input type="text" name="Verification_Code" id="verification_code"  class="required"/>
</div>
   <p>
    Please enter text exactly as it appears above<span class="asterik">*</span>
                </p>
                </div>

        <div class="btn-sm btn-app btn-sm-prog" name="submit">
            submit application
        </div>
    </form>
</div>

以下是引用表单的Javascript。如果这有帮助，请告诉我。

$(document).ready(function(){

$('.vCSS_input_addtocart').after('<div class="btnquotewrapper"><img     src="/v/vspfiles/templates/160/images/btn_getaquote.gif" class="btnquote"/></div>');
$('.v65-productDisplay-row a.colors_text').after('<div class="btnquotewrapper"><img src="/v/vspfiles/templates/160/images/btn_getaquote_small.gif" class="btnquotelist" data- pname="" data-pid=""/></div>');
var i=-1;
$('.btnquotelist').each(function(){
i++;
$(this).attr('data-pname', $($('.colors_productname')[i]).html());
$(this).attr('data-pid', $($('.colors_text b')[i]).html());
});




$('.btnquotelist').bind('click', function(ev){
var node = $(ev.currentTarget);


var hosturl = get_hostname(window.location.href);
var pname = node.attr('data-pname');
var pid = node.attr('data-pid');
 pid = pid.substring(1) 
hosturl  = hosturl  + '/Articles.asp?ID=288&pname='+pname+'&pid='+pid;

$.get( hosturl, function(data) {
var urlparamobj = getQueryParams(hosturl);
var prodid = urlparamobj.pid;
var pname = urlparamobj.pname;

var content = $(data).find('#div_articleid_288').html();
var vday = GetDayToday();



$('.tempholder').html(content);
$('.tempholder').find('.pname').html('<input type="text" id="ProductName" value="'+pname+'"  style="width:300px" disabled/>');
$('.tempholder').find('.pid').html('<input type="text" id="ProductID" value="'+pid+'" disabled/>');
$('.tempholder').find('.dayfield').html('<input type="text" name="dateplaced"     id="dateplaced"value="'+vday+'" disabled/>');



content = '<div class="quoteform">'+$('.tempholder').html()+'</div>';
$('.tempholder').html('');

Shadowbox.open({
        content: content,
        player: "html",
        title: "",
        height: '900',
        width: '800',
        enableKeys: false
      });

});
});





$('.btnquote').bind('click', function(){
var hosturl = get_hostname(window.location.href);
var pname = $('meta[property="og:title"]').attr('content');
var pid = $('.product_code').text() ? $('.product_code').text() :     $('input[name="ProductCode"]').val();
hosturl  = hosturl  + '/Articles.asp?ID=288&pname='+pname+'&pid='+pid;



$.get( hosturl, function(data) {

var urlparamobj = getQueryParams(hosturl);
var prodid = urlparamobj.pid;
var pname = urlparamobj.pname;
var vday = GetDayToday();

var content = $(data).find('#div_articleid_288').html();
$('.tempholder').html(content);
$('.tempholder').find('.pname').html('<input type="text" id="ProductName"     value="'+pname+'"  style="width:300px" disabled/>');
$('.tempholder').find('.pid').html('<input type="text" id="ProductID" value="'+pid+'"     disabled/>');
$('.tempholder').find('.dayfield').html('<input type="text" name="dateplaced"     id="dateplaced"value="'+vday+'" disabled/>');

content = '<div class="quoteform">'+$('.tempholder').html()+'</div>';
$('.tempholder').html('');


Shadowbox.open({
        content: content,
        player: "html",
        title: "",
        height: '900',
        width: '800',
        enableKeys: false
      });
})
});

$(document).delegate('.required', 'focus', function(ev) {

var node = $(ev.currentTarget);
if (node.val() == node.data('validation')) {
node.val('');
}
if (node.hasClass('reqvalidate')) {
node.removeClass('reqvalidate');
node.val('');
//node.parents('.cf-row').find('.valerror').html('').fadeOut();
}
if (node.val() =='' && node.hasClass('fieldval') == false) {
node.addClass('fieldval');
}
});
$(document).delegate('.required', 'focusout', function(ev) {
var node = $(ev.currentTarget);
if (node.val()=='' && node.data('validation') !=''){
node.val(node.data('validation'));
node.removeClass('fieldval');
}
});
$(document).delegate('.btn-app', 'click', function(ev) {
var node = $(ev.currentTarget);
var reqfields = $('.required');
var errcount = 0;
var email = $('#email').val();
var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
for(var i=0; i<reqfields.length; i++ ) {
var item = $(reqfields[i]);
if ((item.val() == '') || (item.val() == item.data('validation'))) {
errcount = errcount + 1;
item.val(item.data('validation'));
item.addClass('reqvalidate');
}
}
if (email != '') {
if (reg.test(email) == false) {
//$('.err-valid-email').html('Invalid Email Address');
//$('.err-valid-email').fadeIn();
errcount = errcount + 1;
$('#email').addClass('reqvalidate');
}
}
if (errcount ==0) {
$('#application').submit();
}
});



$('.phone').bind('click' , function(ev){
var node = $(ev.currentTarget);
node.mask("(999) 999-9999");
});


$(document).delegate('.phone', 'click', function(ev) {
var node = $(ev.currentTarget);
node.mask("(999) 999-9999");
});
});


function get_hostname(url) {
    var m = url.match(/^http:\/\/[^/]+/);
    return m ? m[0] : null;
}
function getQueryParams(qs) {
    qs = qs.split("+").join(" ");

    var params = {}, tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])]
            = decodeURIComponent(tokens[2]);
    }
    return params;
}

function GetDayToday(){
 var mydate=new Date()
        var year=mydate.getYear()
        if (year < 1000)
        year+=1900
        var day=mydate.getDay()
        var month=mydate.getMonth()
        var daym=mydate.getDate()
        if (daym<10)
        daym="0"+daym
        var montharray=new     Array("January","February","March","April","May","June","July","August","September","October    ","November","December")
        return montharray[month]+" "+daym+", "+year;


}

1 个答案:

答案 0 :(得分：0)

表格信息仅在以下时间通过提交：

a）有一个html输入和

b）输入有一个name

值不可用的原因是因为您刚刚为日期，产品名称和产品ID创建了<div>个元素。

您需要创建某种输入，每种输入都有相应的名称。 

<input type='date' name='date' />
<input type='text' name='productName' />
<input type='text' name='productID' />

添加输入后，将提交值。

相关问题
最新问题