1

I've been working on this code I found somewhere. I use it to submit the Send to Friend form from a popup. It works but I can't get it to display the success message after it submits the form. Right now after it submits the form it just disappears. Maybe someone good at ajax can see what's the matter with it. Thanks

<script type="text/javascript">
    //<![CDATA[
        var formId = 'product_sendtofriend_form';
        var sendfriendForm = new VarienForm(formId, false);
        var postUrl = '<?php echo $this->getSendUrl() ?>';
        function doAjax() {
            if (sendfriendForm.validator.validate()) {
                new Ajax.Updater(
                    { success:'formSuccess' }, postUrl, {
                        method:'post',
                        asynchronous:true,
                        evalScripts:false,
                        onComplete:function(request, json) {
                            Element.hide(formId);
                            Element.show('formSuccess');
                        },
                        onLoading:function(request, json){
                            Element.show('formLoader');
                        },
                        parameters: $(formId).serialize(true),
                    }
                );
            }
        }

        new Event.observe(formId, 'submit', function(e){
            e.stop();
            doAjax();
        });
    //]]>
    </script>
0

Thanks to you pointing me in the right place to look I figured out something that worked. I changed Element.show('formSuccess'); to Element.show('formSuccess2'); and added the div like this <div id="formSuccess2" style="display:none">hello</div>

<script type="text/javascript">
//<![CDATA[
    var formId = 'product_sendtofriend_form';
    var sendfriendForm = new VarienForm(formId, false);
    var postUrl = '<?php echo $this->getSendUrl() ?>';
    function doAjax() {
        if (sendfriendForm.validator.validate()) {
            new Ajax.Updater(
                { success:'formSuccess' }, postUrl, {
                    method:'post',
                    asynchronous:true,
                    evalScripts:false,
                    onComplete:function(request, json) {
                        Element.hide(formId);
                        Element.show('formSuccess2');
                    },
                    onLoading:function(request, json){
                        Element.show('formLoader');
                    },
                    parameters: $(formId).serialize(true),
                }
            );
        }
    }

    new Event.observe(formId, 'submit', function(e){
        e.stop();
        doAjax();
    });
//]]>
</script>
0

Change code

onComplete:function(request, json) {
                            Element.hide(formId);
                            Element.show('formSuccess');
                        }

to:

onComplete:function(request, json) {                            
                            $('formSuccess').show();
                        }
  • It works that way but not how it needs to work. If I put `<div id="formSuccess" style="display:none">hello</div>' it replaces the div with the whole products details page and tries to put that into the popup. I would like it to show "hello" or go get another html document. I've tried everything I can think of. Thanks – Freejoy Apr 13 '16 at 18:48
  • updated answer check it – Prashant Valanda Apr 13 '16 at 20:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.