Question

I have an order form where a user gives some input about a product and when s/he submits the form s/he will receive an email which contains product specification.

Basically the website provide Logo designing services.

Here products are : 3 Logo Mockups, 5 Logo Mockups, 7 Logo Mockups and 10 Logo Mockups, not any tangible product like(other shopping cart offers).

Now, I have created a PayPal Buy Now button using paypal account for that product and want to send an email(which contain product specification that s/he had already filled before click to Buy Now button) to the customer as well as redirecting them to the appropriate product checkout page generated by PayPal.

Paypal Buy Now button code is:

<form id="logo-design-paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post">
    <input type="hidden" name="cmd" value="_s-xclick">
    <input type="hidden" name="hosted_button_id" value="46J7HLDHY7TBE">
    <table>
        <tr>
        <td><input type="hidden" name="on0" value="Logo Design">
            Logo Design</td>
        </tr>
        <tr>
        <td><select name="os0">
        <option value="3 Logo Mockups">3 Logo Mockups $50.00</option>
        <option value="5 Logo Mockups">5 Logo Mockups $120.00</option>
        <option value="7 Logo Mockups">7 Logo Mockups $350.00</option>
        <option value="10 Logo Mockups">10 Logo Mockups $650.00</option>
        </select>
        </td>
        </tr>
    </table>
    <input type="hidden" name="currency_code" value="USD">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">

Answer 1

If I understand your question correctly, earlier, you created a form with a normal submit button. If a user enters all the input and clicks submit, you would send him an email. Right now, you replaced the normal button with a PayPal submit button and you wants that PayPal button to invoke the sending email function just like the old button. If that’s what you want to do, you can try this way:

<div id="paypal_button">
    // wrap your encrypted paypal button in a div
</div>

// PayPal button is actually a form so you can make a script like the following

<script type="text/javascript">
    $("div#paypal_button > form").submit(function() {

        // Call your sending email function here (maybe by using Ajax)

    });
</script>

EDIT: if you don’t want to bind onclick event to the PayPal button itself, I think you should use this Ajax plugin to submit your original form (i.e. don’t use normal submit because the user would be redirected to the page in action attribute and it’d be more difficult to achieve what you want).

<form id="original_form" action="somePage">
    ...
    <input type="submit" value="Submit" /> 
</form>

<div id="paypal_button" style="display:none">
    // wrap your encrypted paypal button in a HIDDEN div
</div>

<script type="text/javascrip">
    $(document).ready(function() {
        // submit your original form to send the email and redirect the user on success
        $('#original_form').ajaxForm({
            success: function() { 
               $("div#paypal_button > form").submit();
            }     
        });

    });
</script>