Solved

jqery boxy automatically close box on submit

Posted on 2010-11-08
2
845 Views
Last Modified: 2012-05-10
I'm using the following script from
http://www.varnagiris.net/2009/04/11/ajax-feedback-form-using-jquery-boxy-plugin/

How can I make it close the window automatically after it receives the callback inside function(data){?



$(function() {

    /* set global variable for boxy window */

    var contactBoxy = null;

    /* what to do when click on contact us link */

    $('.contact_us').click(function(){

        var boxy_content;

        boxy_content += "<div style=\"width:300px; height:300px\"><form id=\"feedback\">";

        boxy_content += "<p>Subject<br /><input type=\"text\" name=\"subject\" id=\"subject\" size=\"41\" /></p><p>Your name and/or email:<br /><input type=\"text\" name=\"your_email\" size=\"41\" /></p><p>Comment:<br /><textarea name=\"comment\" id=\"comment\" cols=\"39\" rows=\"5\"></textarea></p><br /><input type=\"submit\" name=\"submit\" value=\"Send >>\" />";

        boxy_content += "</form></div>";

        contactBoxy = new Boxy(boxy_content, {

            title: "Send feedback",

            draggable: false,

            modal: true,

            behaviours: function(c) {

                c.find('#feedback').submit(function() {

                    Boxy.get(this).setContent("<div style=\"width: 300px; height: 300px\">Sending...</div>");

                    // submit form by ajax using post and send 3 values: subject, your_email, comment

                    $.post("feedback.php", { subject: c.find("input[name='subject']").val(), your_email: c.find("input[name='your_email']").val(), comment: c.find("#comment").val()},

                    function(data){

                        /*set boxy content to data from ajax call back*/

                        contactBoxy.setContent("<div style=\"width: 300px; height: 300px\">"+data+"</div>");

                    });

                    return false;

                });

            }

        });

        return false;

    });

});

Open in new window

0
Comment
Question by:NewtonianB
2 Comments
 
LVL 9

Assisted Solution

by:pg-expert
pg-expert earned 100 total points
Comment Utility
set a id to the div and hide it inside the function

refer
http://api.jquery.com/hide/

HTH
~PG
0
 
LVL 18

Accepted Solution

by:
Sudaraka Wijesinghe earned 400 total points
Comment Utility
Code behind the close button of the window (Boxy) is;

                        self.hide();
                        jQuery(document.body).unbind('keypress.boxy');

So you'll have to both hide and unbind the event for a clean exit.
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now