使用Javascript将变量传递到购物车

时间：2010-04-23 18:56:29

标签： javascript variables shopping-cart

这个问题是这个问题的延伸：

Calculate order price by date selection value

我正在尝试根据上一页制作会议注册页面，该页面使用javascript将变量（名称，电子邮件，价格）传递给我组织的过时购物车。我也在使用CSSTricks的研讨会注册（http://css-tricks.com/examples/SeminarRegTutorial/）

目前，我进入付款按钮会在第298行产生'元素未定义'错误（在未解决的上一个问题上也是如此，链接在上面^）：

 switch (document.Information.amount.value) {

非常感谢任何帮助。我的智慧结束了。这是页面：

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <title>Seminar Registration Form with jQuery</title>

    <link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />


    <script src="js/jquery-1.2.6.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/form-fun.jquery.js" type="text/javascript" charset="utf-8"></script>

    <!--[if IE]>
        <style type="text/css">
            legend { 
                position: relative;
                top: -30px;
            }

            fieldset {
                margin: 30px 10px 0 0;
            }
        </style>

        <script type="text/javascript">
            $(function(){
                $("#step_2 legend").css({ opacity: 0.5 });
                $("#step_3 legend").css({ opacity: 0.5 });
            });
        </script>
    <![endif]-->
</head>

<body>


    <div id="page-wrap">

        <h1>MFYC'10 <span>Registration</span></h1>

        <form action="#" name="Information" method="post">

            <fieldset id="step_1">

                <legend>Step 1</legend>

                <label for="num_attendees">
                    How cool are you?
                </label>
                <select id="amount">
                    <option id="0" value="0">Please Choose</option>
                    <option id="prof" value="90.00">Professional</option>
                    <option id="grad" value="55.00">Graduate Student</option>

                </select>

                <br />

                <div id="attendee_1_wrap" class="name_wrap push">
                    <h3>Who are you?</h3>

                    <p>
                    <label for="FirstName">
                            First Name:
                    </label>
                    <input type="text" id="FirstName" class="name_input"></input>
                    </p>

                    <p>
                    <label for="LastName">
                            Last Name:
                    </label>
                    <input type="text" id="LastName" class="name_input"></input>
                    </p>

                    <p>
                    <label for="OfficialTitle">
                            Official Title:
                    </label>
                    <input type="text" id="OfficialTitle" class="name_input"></input>
                    </p>

        <h3>How do we find you?</h3>


                <label for="email">Email: </label>

<input id="email" name="email" class="required email" />
</p>

<p>
<label for="Address">Street Address: </label><input name="Address" id="Address" type="text" size="20" maxlength="75" />
</p>
<p>
<label for="City">City: </label><input name="City" id="City" />
</p>
<p>
<label for="State">State: </label><select name="State" id="State">

<option selected value="IL">IL</option>
    <option value="AL">AL</option>
    <option value="AK">AK</option>
    <option value="AZ">AZ</option>
    <option value="AR">AR</option>
    <option value="CA">CA</option>

    <option value="CO">CO</option>
    <option value="CT">CT</option>
    <option value="DE">DE</option>
    <option value="DC">DC</option>
    <option value="FL">FL</option>
    <option value="GA">GA</option>

    <option value="HI">HI</option>
    <option value="ID">ID</option>
    <option value="IN">IN</option>
    <option value="IA">IA</option>
    <option value="KS">KS</option>
    <option value="KY">KY</option>

    <option value="LA">LA</option>
    <option value="ME">ME</option>
    <option value="MD">MD</option>
    <option value="MA">MA</option>
    <option value="MI">MI</option>
    <option value="MN">MN</option>

    <option value="MS">MS</option>
    <option value="MO">MO</option>
    <option value="MT">MT</option>
    <option value="NE">NE</option>
    <option value="NV">NV</option>
    <option value="NH">NH</option>

    <option value="NJ">NJ</option>
    <option value="NM">NM</option>
    <option value="NY">NY</option>
    <option value="NC">NC</option>
    <option value="ND">ND</option>
    <option value="OH">OH</option>

    <option value="OK">OK</option>
    <option value="OR">OR</option>
    <option value="PA">PA</option>
    <option value="RI">RI</option>
    <option value="SC">SC</option>
    <option value="SD">SD</option>

    <option value="TN">TN</option>
    <option value="TX">TX</option>
    <option value="UT">UT</option>
    <option value="VT">VT</option>
    <option value="VA">VA</option>
    <option value="WA">WA</option>

    <option value="WV">WV</option>
    <option value="WI">WI</option>
    <option value="WY">WY</option>
</select>
</p>
<p>
<label for="Zip">Zip Code: </label><input name="Zip" id="Zip" type="text" value="" size="5" maxlength="10"  />
</p>
<p>
<label for="Phone">Telephone: </label><input name="Phone" id="Phone" type="text" value="" size="10" maxlength="13" />
</p>


                </div>


            </fieldset>

            <fieldset id="step_2">

                <legend>Step 2</legend>

                <p>
                    Do you work in Higher Education?
                </p>


                <input type="radio" id="company_name_toggle_on" name="company_name_toggle_group"></input>
                <label for="company_name_toggle_on">Yes</label>
                &emsp;
                <input type="radio" id="company_name_toggle_off" name="company_name_toggle_group"></input>
                <label for="company_name_toggle_off">No</label>

                <div id="company_name_wrap">
                    <label for="company_name">
                        Which School?
                    </label>
                    <input type="text" id="company_name"></input>
                </div>

                <div class="push">          
                    <p>
                        Will anyone in your group require special accommodations?
                    </p>

                    <input type="radio" id="special_accommodations_toggle_on" name="special_accommodations_toggle"></input>
                    <label for="special_accommodations_toggle_on">Yes</label>
                    &emsp;
                    <input type="radio" id="special_accommodations_toggle_off" name="special_accommodations_toggle"></input>
                    <label for="special_accommodations_toggle_off">No</label>
                </div>
                <div id="special_accommodations_wrap">
                    <label for="special_accomodations_text">
                        Please explain below:
                    </label>
                    <textarea rows="10" cols="10" id="special_accomodations_text"></textarea>
                </div>


            </fieldset>

            <fieldset id="step_3">
                <legend>Step 3</legend>

                <label for="rock">
                    Are you ready to rock?
                </label>
                <input type="checkbox" id="rock"></input>
            <p>
                <INPUT onclick="javascript:PaymentButtonClick()" type=button value="Proceed to payment" name=PaymentButton>

                <img src="images/visa1.gif" />
                <img src="images/mastercard1.gif" />
            </p>

            </fieldset>

        </form>

    </div>

<FORM name="emailForm" action="http://www.its.niu.edu/its/scripts/mailform.asp method=post">

<INPUT type="hidden" value="Conference Registration" name="mf_subject">
<INPUT type="hidden" value="Yes" name="mf_email_results"> 


<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="20" name="amount">


<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="FirstName">
<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="22" name="LastName">

<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="64" name="OfficialTitle">
<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="40" name="email">
<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="48" name="Address">

<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="City">
<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="State">
<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="Zip">


<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="Phone">

<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="company_name">


<INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="20" name="special_accomodations_text">

<INPUT type="hidden" value="fyconference@niu.edu" name="mf_from">

<INPUT type="hidden" value="mpfefferle@niu.edu" name="mf_to">
</FORM>










<FORM name="addform" action="https://webcluster.niu.edu/CreditCard/servlet/Shopping_Cart_Add_Item_Servlet" method="post">

<INPUT type="hidden" value="orient" name="Dept_ID">
<INPUT type="hidden" value="Orientation" name="Product_Name">
<INPUT type="hidden" value="z000000" name="Product_Code">
<INPUT type="hidden" value="7.00" name="amount">
<INPUT type="hidden" value="/orientation/index.shtml" name="return_link">
<INPUT type="hidden" value="http://www.niu.edu" name="return_server">
<INPUT type="hidden" value="1" name="quantity"> <INPUT type="hidden" value="0" name="tax">
<INPUT type="hidden" value="0" name="ship"> <INPUT type="hidden" value="DQ83225" name="sale_id">
<INPUT type="hidden" value="401200" name="sale_acct">
</FORM>


<SCRIPT language="Javascript"> 

function PaymentButtonClick() {



    document.addform.Product_Name.value = document.Information.FirstName.value + ","+ 
                                          document.Information.LastName.value+","+
                                          document.Information.OfficialTitle.value+","+
                                          document.Information.email.name+","+","+
                                          document.Information.Address.value+ "," + 
                                          document.Information.City.value+ "," + 
                                          document.Information.State.value+ "," + 
                                          document.Information.Zip.value+ "," + 
                                          document.Information.Phone.value+ "," + 
                                          document.Information.company_name.value+ "," + 
                                          document.Information.special_accomodations_text.value;

    document.addform.Product_Code.value = document.Information.LastName.value;


    if ((document.Information.amount.value != "") && 
        (document.Information.amount.value != "x")) {

        if (document.Information.LastName.value != "" ||
            document.Information.FirstName.value != "" )  {

                document.addform.submit();
        }
        else { 
            alert("Please enter missing information");
        } 
    }
}

</SCRIPT>





</body>
</html>

1 个答案:

答案 0 :(得分：0)

我做了一些明显的编辑（表单名称等），我错过了它并传递到购物车，但是，这一行：

    <INPUT type="hidden" value="" name="amount">

不会显示此处确定的价格：

switch (document.Information.amount.value) {
 case 'prof':
     document.Information.amount.value = 90.00;
     break;
 case 'grad':
     document.Information.amount.value = 55.00;
     break;
}
相关问题
最新问题