使用表单字段中的数据填充动态链接

时间:2014-03-19 19:45:19

标签: javascript php jquery

我已经在这个项目上工作了一段时间,并感谢任何帮助。我有一个表单,并希望我编写的PHP文件中使用的表单中的数据使用$ _GET来提取这些值,然后在PDF中使用它们。

在一些帮助下,我已经能够提出一个脚本,该脚本使用模糊功能从表单中检索数据并将其插入动态链接,然后将值传递给PHP文件并具有在这里建立了一个有效的方法:

http://jsfiddle.net/ZhCZS/3/

表格代码:

<form class="cart" method="post" enctype='multipart/form-data'>
<div class="gform_variation_wrapper gform_wrapper">
    <input type="hidden" id="product_id" name="product_id" value="36" />
    <input type="hidden" id="_wpnonce" name="_wpnonce" value="4ededc9481" />
    <input type="hidden" name="_wp_http_referer" value="/product/prepare-for-your-closing-copy/" />
    <div class='gf_browser_gecko gform_wrapper' id='gform_wrapper_1'>
        <div class='gform_body'>
            <ul id='gform_fields_1' class='gform_fields top_label description_below'>
                <li id='field_1_13' class='gfield           gfield_price gfield_price_1_13 gfield_product_1_13    gfield_contains_required'>
                    <label class='gfield_label' for='input_1_13'>Quantity<span class='gfield_required'>*</span>
                    </label>
                    <div class='ginput_container'>
                        <select name='input_13' id='input_1_13' class='medium gfield_select' tabindex='1'>
                            <option value='500 - $269.00|269'>500 - $269.00</option>
                            <option value='1000 - $319.00|319'>1000 - $319.00</option>
                        </select>
                    </div>
                </li>
                <li id='field_1_14' class='gfield'>
                    <label class='gfield_label' for='input_1_14'>Total</label>
                    <div class='ginput_container'><span class='ginput_total ginput_total_1'>$0.00</span>
                        <input type='hidden' name='input_14' id='input_1_14' class='gform_hidden' />
                    </div>
                </li>
                <li id='field_1_1' class='gfield'>
                    <label class='gfield_label' for='input_1_1'>Location</label>
                    <div class='ginput_container'>
                        <select name='input_1' id='input_1_1' class='medium gfield_select' tabindex='2'>
                            <option value='Addison'>Addison</option>
                            <option value='Arlington'>Arlington</option>
                            <option value='Colleyville'>Colleyville</option>
                            <option value='Fire Wheel'>Fire Wheel</option>
                            <option value='Flower Mound'>Flower Mound</option>
                            <option value='Fort Worth'>Fort Worth</option>
                            <option value='Legacy'>Legacy</option>
                            <option value='Mansfield'>Mansfield</option>
                            <option value='McDermott'>McDermott</option>
                            <option value='Preston Corners'>Preston Corners</option>
                        </select>
                    </div>
                </li>
                <li id='field_1_19' class='gfield'>
                    <label class='gfield_label' for='input_1_19'>Address</label>
                    <div class='ginput_container'>
                        <input name='input_19' id='input_1_19' type='text' value='' class='medium' tabindex='3' />
                    </div>
                </li>
                <li id='field_1_21' class='gfield'>
                    <label class='gfield_label' for='input_1_21'>City, State, ZIP</label>
                    <div class='ginput_container'>
                        <input name='input_21' id='input_1_21' type='text' value='' class='medium' tabindex='4' />
                    </div>
                </li>
                <li id='field_1_20' class='gfield'>
                    <label class='gfield_label' for='input_1_20'>Suite1</label>
                    <div class='ginput_container'>
                        <input name='input_20' id='input_1_20' type='text' value='' class='medium' tabindex='5' />
                    </div>
                </li>
                <li id='field_1_11' class='gfield'>
                    <label class='gfield_label' for='input_1_11'>Reference</label>
                    <div class='ginput_container'>
                        <input name='input_11' id='input_1_11' type='text' value='' class='medium' tabindex='6' />
                    </div>
                </li>
                <li id='field_1_12' class='gfield'>
                    <label class='gfield_label' for='input_1_12'>Notes</label>
                    <div class='ginput_container'>
                        <textarea name='input_12' id='input_1_12' class='textarea medium' tabindex='7' rows='10' cols='50'></textarea>
                    </div>
                </li>
                <li id='field_1_15' class='gfield     gform_hidden'>
                    <input name='input_15' id='input_1_15' type='hidden' class='gform_hidden' value='Vendor X' />
                </li>



<li id='field_1_22' class='gfield      gfield_html gfield_html_formatted gfield_no_follows_desc'>
<a id="mylink" href="#" target="_blank">Send to PDF</a>

<span>the link contains: </span><span id="showmehref"></span>
                </li>
            </ul>
        </div>
        <div class='gform_footer top_label'>
            <input type='hidden' class='gform_hidden' name='is_submit_1' value='1' />
            <input type='hidden' class='gform_hidden' name='gform_old_submit' value='1' />
            <input type='hidden' class='gform_hidden' name='gform_unique_id' value='' />
            <input type='hidden' class='gform_hidden' name='state_1' value='WyJhOjE6e2k6MTM7YToyOntpOjA7czozMjpcIjYzNDM5OTkzYmRhMDU2NGM5NWUwNGU4ZDgyNTM4NWFiXCI7aToxO3M6MzI6XCI1MTk1MjNiNmI1ZDM0NDk2NmJhZGY3M2I4YzIxYWEyYlwiO319IiwiMTYzYjgzMmJjODZhMWU2NzJkYTQ5YTQ3OWE2OWJjMzciXQ==' />
            <input type='hidden' class='gform_hidden' name='gform_target_page_number_1' id='gform_target_page_number_1' value='0' />
            <input type='hidden' class='gform_hidden' name='gform_source_page_number_1' id='gform_source_page_number_1' value='1' />
            <input type='hidden' name='gform_field_values' value='' />
        </div>
    </div>
    <input type="hidden" name="gform_form_id" id="gform_form_id" value="1" />
    <input type="hidden" id="woocommerce_get_action" value="" />
    <input type="hidden" id="woocommerce_product_base_price" value="0" />
</div>
<input type="hidden" name="add-to-cart" value="36" />
<div class="clear"></div>
<div class="quantity">
    <input type="number" step="1" min="1" name="quantity" value="1" title="Qty" class="input-text qty text" size="4" />
</div>
<input type="hidden" name="add-to-cart" value="36" />
<button type="submit" class="addToCart single_add_to_cart_button button alt">Add to cart</button>
</form>

脚本代码:

$("form.cart").on('blur', ':input', function(){
var linkText = "http://www.ortorderdesk.com/proofs/397288.php?" + $("form.cart").serialize();
$("#showmehref").text(linkText);
$("#mylink").attr('href', linkText);
});

不幸的是,当我将代码实现到我的网站时,它并不起作用。它只是用&#34;#&#34;附加当前页面的URL,基本上忽略了脚本。

请参阅以下代码: http://www.ortorderdesk.com/product/prepare-for-your-closing-copy/

包含我的脚本的javascript文件名为blur.js。

我没有正确地称呼它吗?我的语法在我的网站中实现它是否有错误?

我尝试在页眉和页脚中引用blur.js而没有任何正面结果。

非常感谢任何帮助。

谢谢!

1 个答案:

答案 0 :(得分:-1)

脚本部分是否在脚本块中。如果确定你脚本必须有一个$(文件).ready(function(){.....}。是必要的,代码是否在网站加载后运行。