Avatar billede propaganja Nybegynder
10. januar 2014 - 19:42 Der er 15 kommentarer

Problemer med en Paypal Javaknap

I scriptet herunder beskrives knappen "Bottom_payment_button" - jeg ønsker at man ved klik på den, føres til et nyt vindue. Er der nogen som ved hvordan jeg gør dette? Har ingen java erfaring.

Håber at der er en venlig sjæl, der kan hjælpe mig. tusinde tak.



<script type="text/javascript">
//<![CDATA[
    var payment_method_chosen = false;
    var using_coupon = false;

    /* Make sure they choose a payment provider */
    function confirm_payment_provider() {
        //if terms and conditions is enabled and the customer didn't tick agree terms and conditions
        if($('.CheckoutHideOrderTermsAndConditions').css('display') != "none" && $('#AgreeTermsAndConditions').prop('checked') != true){
            alert(lang.TickArgeeTermsAndConditions);
            return false;
        }

        // If they are using a coupon code we don't need to validate any of the form
        if (using_coupon) {
            return true;
        }

        if($('#use_store_credit').css('display') != "none") {
            if($('#store_credit:checked')) {
                if($('#credit_provider_list').css('display') != "none") {
                    var length = $('#credit_provider_list').find('input').length;
                    if(length == 0) {
                        var checked = 1;
                    }
                    else {
                        var checked = $('#credit_provider_list').find('input:checked').length;
                    }
                }
                else {
                    checked = 1;
                }
            }
            else {
                var length = $('#provider_list').find('input').length;
                if(length == 0) {
                    var checked = 1;
                }
                else {
                    var checked = $('#provider_list').find('input:checked').length;
                }
            }
        }
        else if ($('#payment_options').css('display') != "none") {
            var length = $('#provider_list').find('input').length;
            if(length == 0) {
                var checked = 1;
            }
            else {
                var checked = $('#provider_list').find('input:checked').length;
            }
        }

        if(checked == 0) {
            alert("%%LNG_PleaseChooseAPaymentMethod%%");
            return false;
        }
        else {
            return true;
        }
    }

    /* Is this an online or offline button? If offline change the submit button */
    function checkout_provider_changed(obj) {
        var bottom_payment_button = g("bottom_payment_button");
        payment_method_chosen = true;
        if(obj.className.indexOf("PAYMENT_PROVIDER_ONLINE") >= 0) {
            bottom_payment_button.src = "%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButton.gif";
            bottom_payment_button.value = "%%LNG_ProceedToPayment%%";
        }
        else {
            bottom_payment_button.src = "%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButtonContinue.gif";
            bottom_payment_button.value = "%%LNG_ProceedToPaymentContinue%%";
        }
    }

    function update_order_credit_payment(status) {
        var bottom_payment_button = g("bottom_payment_button");
        if(status == true) {
            $('#use_store_credit').show();
            $('#provider_list').hide();
            $('#provider_list').removeClass('PL40');
            if($('#credit_provider_list').css('display') != "none") {
                bottom_payment_button.src = "%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButton.gif";
                bottom_payment_button.value = "%%LNG_ProceedToPayment%%";
            }
            else {
                bottom_payment_button.src = "%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButtonContinue.gif";
                bottom_payment_button.value = "%%LNG_ProceedToPaymentContinue%%";
            }
        }
        else {
            $('#use_store_credit').hide();
            if($('#provider_list input').length > 1) {
                $('#provider_list').show();
                $('#provider_list').addClass('PL40');
            }
        }
    }

    function ShowContinueButton() {
        var bottom_payment_button = g("bottom_payment_button");
        bottom_payment_button.src = "%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButtonContinue.gif";
        bottom_payment_button.value = "%%LNG_ProceedToPaymentContinue%%";

        var top_payment_button = g("top_payment_button");
        if(top_payment_button) {
            top_payment_button.src = "%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButtonContinue.gif";
            bottom_payment_button.value = "%%LNG_ProceedToPaymentContinue%%";
        }
    }



    $(document).ready(function() {
        $('#couponcode').keypress(function(event) {
            if(event.keyCode == 13) {
                $('#apply_code').trigger('click');
                return false;
            }
        });
    });
//]]>
</script>
Avatar billede Slater Ekspert
11. januar 2014 - 15:17 #1
Jeg kan ikke umiddelbart se noget i den kode, der beskriver hvad den knap skal gøre når klikket på.

Har du mulighed for at vise os hele sidens kode? Jeg synes næsten der må mangle noget vigtigt.
Avatar billede propaganja Nybegynder
11. januar 2014 - 16:17 #2
hej, det er hele siden. koden bliver brugt i min Confirm Order side, hvor en knap nederst på siden skal føre kunden videre til paypal. Jeg forsøger at få den knap til at åbne i et nyt vindue. I confirm order siden er koden:


                <p class="FloatRight">
                    <input id="bottom_payment_button" style="display:%%GLOBAL_HideButtomPaymentButton%%" type="image" src="%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButton.gif"/>
                </p>
Avatar billede Slater Ekspert
11. januar 2014 - 19:15 #3
Det kan umuligt være hele sidens kode, da det kun er Javascript og intet HTML - og desuden afhænger Javascriptet af jQuery, og det bliver ikke indlæst i den synlige kode.

Vi er nok nødt til at se HTML'en også, for at vide hvordan den knap fungerer. Elementet må blive defineret et sted, men er det en <button>, en <input>, en <a> eller noget andet? Og hvordan ved den hvor den skal gå hen?
Avatar billede propaganja Nybegynder
11. januar 2014 - 22:35 #4
jeg ved ikke om jeg overhovedet forklarer mig godt nok, det må du meget undskylde. mit webshop modul er en række filer jeg kan customize i, hver html fil henter en masse forskellige funktioner fra scripts gemt som separate filer. giver det mening?

Den html fil, som dette script indgår i er her. Nederst på siden finder jeg beskrivelse af knappen. den er <input> når man trykker på den går den til "proceed to payment" hos paypal. et link jeg ikke kan definere i hvert fald. håber jeg kan finde ud af at åbne knappens funktion i et nyt vindue når man klikker på den.

<div class="Block Moveable Panel" id="ConfirmOrder">
    <form method="post" action="%%GLOBAL_ShopPath%%/checkout.php" onsubmit="return confirm_payment_provider()">
        <input type="hidden" name="action" value="pay_for_order" />

        <h2 style="height:30px">
            <span style="display:%%GLOBAL_HideTopPaymentButton%%;" class="FloatRight">
                <input type="image" id="top_payment_button" src="%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButton.gif" />
            </span>
            %%LNG_ConfirmYourOrder%%
        </h2>
        <div class="BlockContent">
            <p class="ErrorMessage Message" style="display: %%GLOBAL_HideCheckoutError%%">
                %%GLOBAL_CheckoutErrorMsg%%
            </p>

            <p class="SuccessMessage Message" style="display: %%GLOBAL_HideCheckoutSuccess%%">
                %%GLOBAL_CheckoutSuccessMsg%%
            </p>

            <div style="display: %%GLOBAL_HideConfirmOrderPage%%">
                <div class="BillingDetails">
                    <h3>%%LNG_BillingAddress%%</h3>
                    <p class="PL20">
                        %%GLOBAL_BillingAddress%%
                    </p>
                </div>
                <div class="ShippingDetails" style="%%GLOBAL_HideShippingDetails%%">
                    <h3>%%LNG_ShippingAddress%%</h3>
                    <p class="PL20">
                        %%GLOBAL_ShippingAddress%%
                    </p>
                </div>

                <hr class="Clear" />

                <div class="OrderContents">
                    <h3>%%LNG_YourOrderContainsTheFollowingItems%%</h3>

                    <table class="CartContents Stylize General" cellspacing="0" cellpadding="0">
                        <thead>
                            <tr>
                                <th style="white-space: nowrap;">%%LNG_CartItems%%</th>
                                <th style="white-space: nowrap; text-align: center;">%%LNG_Qty%%</th>
                                <th style="white-space: nowrap; text-align: center;">%%LNG_ItemPrice%%</th>
                                <th style="white-space: nowrap; text-align: right; width: 100px;">%%LNG_ItemTotal%%</th>
                            </tr>
                        </thead>
                        <tfoot>
                            %%GLOBAL_totals%%
                        </tfoot>
                        <tbody>
                            %%SNIPPET_CartItems%%
                        </tbody>
                    </table>

                    <div class="FloatRight CheckoutRedeemCoupon" style="display: %%GLOBAL_HideUseCoupon%%">
                        <h4>%%GLOBAL_RedeemTitle%%</h4>
                        <p>%%GLOBAL_RedeemIntro%%</p>
                        <p>
                            <strong>%%LNG_CouponCode1%%:</strong>
                            <input type="text" name="couponcode" id="couponcode" style="width: 140px;" />
                            <input type="submit" name="apply_code" id="apply_code" value="%%LNG_Apply%%" style="width: 50px;" onclick="return Cart.CheckCouponCode();" />
                        </p>
                    </div>

                    <div style="display: %%GLOBAL_HidePaymentOptions%%" class="PaymentOptions" id="payment_options">
                        <h3>%%LNG_HowWouldYouLikeToPay%%</h3>
                        <div style="display: %%GLOBAL_HideUseStoreCredit%%; width: 420px;">
                            <p class="MB10">
                                <label><input type="radio" name="store_credit" id="store_credit" value="1" checked='checked'  onclick="update_order_credit_payment(true)" /> %%LNG_CheckoutUseStoreCredit%%</label>
                            </p>
                            <div id="use_store_credit" class="PL20" style="display: %%GLOBAL_HideUseStoreCredit%%">
                                <p style="display: %%GLOBAL_HideLimitedCreditWarning%%" class="ErrorMessage Message">%%GLOBAL_CheckoutStoreCreditWarning%%</p>
                                <div class="MB10">
                                    <table cellpadding="3">
                                        <tr>
                                            <td align="right"><strong>%%LNG_StoreCreditBalance%%</strong></td>
                                            <td align="right" width="100" >%%GLOBAL_StoreCredit%%</td>
                                        </tr>
                                        <tr style="display: %%GLOBAL_HideLimitedCreditWarning%%">
                                            <td align="right"><strong>%%LNG_OutstandingOrderTotal%%</strong></td>
                                            <td align="right" width="100" class="ProductPrice">%%GLOBAL_Remaining%%</td>
                                        </tr>
                                        <tr style="display: %%GLOBAL_HideRemainingStoreCredit%%">
                                            <td align="right"><strong>%%LNG_RemainingStoreCredit%%</strong></td>
                                            <td align="right" width="100" style="color: green;">%%GLOBAL_RemainingCredit%%</td>
                                        </tr>
                                    </table>
                                </div>

                                <div class="MB10" style="display: %%GLOBAL_HideLimitedCreditPaymentOption%%">
                                    <p>%%LNG_CreditPaymentMethod%%</p>
                                    <div class="PL20" id="credit_provider_list" style="display: %%GLOBAL_HideLimitedCreditWarning%%">
                                        %%GLOBAL_StoreCreditPaymentProviders%%
                                        %%GLOBAL_CheckoutWith%%
                                    </div>
                                </div>
                            </div>
                            <div class="MB10" style="display: %%GLOBAL_HideCreditAltOptionList%%">
                                <label><input type="radio" name="store_credit" value="0"  onclick="update_order_credit_payment(false); checkout_provider_changed(this);" /> %%GLOBAL_CreditAlt%%</label>
                            </div>
                        </div>
                    </div>

                    <div class="PL20" id="provider_list" style="display:%%GLOBAL_HidePaymentProviderList%%">
                        %%GLOBAL_PaymentProviders%%
                    </div>
                </div>
                <div style="display: %%GLOBAL_HideOrderComments%%" class="CheckoutOrderComments">
                    <hr class="Clear" />
                    <h3>%%LNG_EnterOrderComments%%</h3>
                    <div class="PL20">
                        <textarea name="ordercomments" cols="40" rows="6" class="Field400">%%GLOBAL_OrderComments%%</textarea>
                    </div>
                </div>

                <div style="%%GLOBAL_HideOrderTermsAndConditions%%" class="CheckoutHideOrderTermsAndConditions">
                    <hr class="Clear" />
                    <h3>%%LNG_TermsAndConditions%%</h3>
                    <div class="PL20" style="%%GLOBAL_HideTermsAndConditionsTextarea%%">
                        <textarea readonly="readonly" cols="60" rows="6" class="Field400">%%GLOBAL_OrderTermsAndConditions%%</textarea>
                    </div>

                    <div class="PL20 MT10">
                        <input type="checkbox" name="AgreeTermsAndConditions" id="AgreeTermsAndConditions" />
                        <label for= "AgreeTermsAndConditions">%%GLOBAL_AgreeTermsAndConditions%%</label> %%GLOBAL_TermsAndConditionsLink%%
                    </div>
                </div>

                <div style="display: %%GLOBAL_HideMailingListInvite%%">
                    <hr class="Clear" />
                    <h3>%%LNG_HearFromUsViaEmail%%</h3>

                    <p class="PL20" style="display: %%GLOBAL_HideMailingListInvite%%">
                        <input type="checkbox" class="CheckboxTogglesOtherElements" name="join_mailing_list" id="join_mailing_list" %%GLOBAL_NewsletterBoxIsTicked%% /> <label for="join_mailing_list">%%LNG_WouldLikeToReceiveNewsletter%%</label><br />

                        <span style="display:%%GLOBAL_HideOrderCheckBox%%"><input type="checkbox" class="CheckboxTogglesOtherElements" name="join_order_list" id="join_order_list" %%GLOBAL_OrderBoxIsTicked%% /> <label for="join_order_list">%%LNG_NewsletterSpecialOffersText%%</label><br /></span>
                    </p>
                    <hr />
                </div>

                <p class="FloatRight">
                    <input id="bottom_payment_button" style="display:%%GLOBAL_HideButtomPaymentButton%%" type="image" src="%%GLOBAL_IMG_PATH%%/%%GLOBAL_SiteColor%%/PaymentButton.gif" />
                </p>
            </div>
        </div>
    </form>
    %%Panel.ChooseCheckoutProviderJavaScript%%
    <script type="text/javascript">

        %%GLOBAL_PaymentButtonSwitch%%
        lang.TickArgeeTermsAndConditions = '%%LNG_TickArgeeTermsAndConditions%%';
    </script>
</div>
Avatar billede Slater Ekspert
12. januar 2014 - 08:42 #5
Ja, det er her destinationen er defineret. Den bruger en ganske almindelig form submit funktion til at åbne siden checkout.php

Prøv at ændre linje to i det script her fra

<form method="post" action="%%GLOBAL_ShopPath%%/checkout.php" onsubmit="return confirm_payment_provider()">

til

<form method="post" action="%%GLOBAL_ShopPath%%/checkout.php" onsubmit="return confirm_payment_provider()" target="_blank">


- Godt nok er target="_blank" ikke længere en del af standarden, så hvis du går meget op i W3C-validering giver dette en fejl, men det virker på alle browsere - og hvis det skal gøres anderledes er det en større operation.
Avatar billede propaganja Nybegynder
12. januar 2014 - 10:47 #6
Tusinde tak. Jeg har selv forsøgt med target forskellige steder i den html, men hver gang åbner knappen bare i sammen vindue.

Vil du prøve? Hvis du går ind på www.propaganja.info/test er du i min webshop. hvis du tilføjer noget til din kurv, og trykker proceed to checkout. bliver du ført til confirm order siden. Det er på denne side nederst, at den omtalte og ret irreterende knap sidder.

Den åbner i samme vindue, og går til paypal. den virker. men jeg vil gerne have funktionen i et nyt vindue som sagt.
Avatar billede propaganja Nybegynder
12. januar 2014 - 10:48 #7
lige nu står target koden i scriptet som du sagde. selvom jeg har skrevet det ind, har det åbenbart ikke påvirket noget som helst :/
Avatar billede Slater Ekspert
12. januar 2014 - 11:54 #8
Det er lidt underligt, men som du kan se her står det ikke i formen:

http://i.imgur.com/LeiKj3x.jpg

Til gengæld er den form også lidt anderledes end den du viste mig.
F.eks. står der "return ExpressCheckout.ConfirmPaymentProvider()" i stedet for "return confirm_payment_provider()".

Det er altså på en eller anden måde ikke den rigtige form vi har fat i.


- Ah, nu har jeg lige prøvet lidt, og jeg kan se at HTML'en bliver hentet via AJAX fra https://store-d35nw.mybigcommerce.com/remote.php

Det er et problem, da du ikke har nogen kontrol over hvad mybigcommerce.com returnerer. Det er sikkert nogen du har købt en løsning af, ikke?

Så skal vi ud i noget mere besværligt, nemlig at fange klikket på formen med Javascript. Problemet her er, at vi ikke kan sætte en event-handler før AJAX-kaldet er returneret - og jeg ved faktisk ikke hvordan man gør det. Det kan være andre her kan hjælpe.
Avatar billede Slater Ekspert
12. januar 2014 - 12:02 #9
Ellers kan jeg lige prøve at høre min kollega i morgen.
Jeg arbejder som backend-udvikler, så jeg har normalt ikke så meget med Javascript at gøre. Han er frontend-udvikler og en del mere inde i jQuery end jeg.


Og bare et tip til Eksperten:
Nu har du selv lagt et svar. Det er egentlig ikke meningen du skal gøre det, det er kun den person du vil give point til allersidst der skal det. Fordi du har gjort det, er tråden nu markeret som besvaret, hvilket gør det mindre sandsynligt at andre vil kigge herind for at hjælpe. Bare til en anden gang.
Avatar billede propaganja Nybegynder
12. januar 2014 - 23:03 #10
du er helt fantastisk, tusinde tak for din værdifulde info. du har ret i at jeg har købt modul hos bigcommerce, jeg kan customize i det meste men desværre ikke finde remote.php :/
Avatar billede Slater Ekspert
15. januar 2014 - 16:47 #11
Beklager det tog lidt tid, der har været lidt travlt på arbejdet.

Min kollega fortæller mig, at jQuerys on() funktion kun virker på elementer hentet ind med AJAX hvis man bruger det andet parameter til at vælge objektet. Det anede jeg ikke.

Men det betyder, at hvis du skriver

$('body').on('click', '#bottom_payment_button', function() {
  $(this).parents('form').attr('target', '_blank');
});

Så burde det kunne virke. Det gør det i hvert fald i en test jeg har lavet lokalt, så hvis det ikke gør, må det være noget med selectoren.
Avatar billede propaganja Nybegynder
15. januar 2014 - 20:58 #12
Hej Viperine!

Koden virke sku!! Og nu åbner den i et nyt vindue. det hjælper gevaldigt på det hele :)

Jeg håber du kan se på en anden ting? Når du går ind på www.propaganja.info/test

Så kan du se at der opstår scrolls i min iframe med shoppen. Har du nogen ide til hvordan jeg får bredden på min iframe til at passe med resten af siden så man ikke skal scrolle sidelæns.
Avatar billede Slater Ekspert
15. januar 2014 - 21:48 #13
Har du adgang til den CSS fil der hedder templates/Beautification/Styles/styles.css ?

I den er en regel der ser sådan ud:
#Container {
  width: 1040px;
  margin: auto;
}

Men 1040px er bredere end den iframe den er i, derfor scroller den. Det er desuden også langt bredere end der er brug for. Du kan sætte den helt ned til 840px uden at det klemmer indholdet.
Avatar billede propaganja Nybegynder
15. januar 2014 - 23:02 #14
jeg ved at det er meget forlangt.. men har du skype? jeg betaler dig gerne for at hjælpe med de sidste små detaljer. bliver frustreret her haha. min skype er : smokenhagen.denmark
Avatar billede propaganja Nybegynder
16. januar 2014 - 00:31 #15
hej ven.

det store problem, som nu er opstået efter at knap og scroll virker. er at den har ændret skriftype for knapper så teksten ikke længere kan stå i knappen. det ikke størrelse på knappen eller fonten, det er selve fonten.

templaten har nogle fonts uploadet, jeg forestiller mig at den ikke kan kommunikere med dem længere, men forstår ikke hvorfor. for vi har kun ændret størrelserne på bredde. den er sat til 900 nu.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester