Skip to content

Instantly share code, notes, and snippets.

@jaredwilli
Created December 11, 2010 02:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jaredwilli/737086 to your computer and use it in GitHub Desktop.
Save jaredwilli/737086 to your computer and use it in GitHub Desktop.
jQuery Slidedown form for WP Dashboard
n2wp = {}
n2wp.timezone = function() {
var timezone = (new Date().getTimezoneOffset() / 60) * (-1);
return timezone;
}
n2wp.loading = function() {
return '
<div class="loading"><span>Loading...</span></div>
';
}
jQuery(function($) {
$('body').append('
<div id="n2wp_tab">
<div class="content">
<div class="inner">
<p class="intro">Text and stuff here.</p>
<div class="contact">
<p class="contact">Text and stuff here.</p>
</div>
<p>Text and stuff here.</p>
<p><a href="#" id="n2wp_call_form_toggle">Text and stuff here.</a></p>
<form action="" method="post" id="n2wp_call_form">
<p>
<label for="n2wp_phone">My Phone #:</label>
<input type="text" name="n2wp_phone" id="n2wp_phone" value="" class="text" />
</p>
<p>
<label>Please Call:</label>
<ul class="options">
<li>
<input type="radio" name="n2wp_calltime" id="n2wp_calltime_asap" value="ASAP" checked="checked" />
<label for="n2wp_calltime_asap">ASAP</label>
</li>
<li>
<input type="radio" name="n2wp_calltime" id="n2wp_calltime_at" value="at" />
<label for="n2wp_calltime_at">At this time:</label>
<input type="text" name="n2wp_calltime_at_time" id="n2wp_calltime_at_time" value="" class="text" />
</li>
</ul>
</p>
<p>
<input type="checkbox" name="n2wp_call_info" id="n2wp_call_info" value="1" checked="checked" />
<label for="n2wp_call_info">Form Label</label>
</p>
<p>
<input type="submit" name="n2wp_phone_submit" id="n2wp_phone_submit" value="Please Call Me" class="button-primary" />
or <a href="#" id="n2wp_phone_cancel">Cancel</a></p>
<input type="hidden" name="cf_action" id="cf_action" value="n2wp_request_call" />
</form>
<div id="n2wp_call_form_response"></div>
<p><a href="#" id="n2wp_info_form_toggle">Form Toggle</a></p>
<form action="" method="post" id="n2wp_info_form">
<p class="info">Text and stuff here.</p>
<p>
<input type="submit" name="n2wp_info_submit" id="n2wp_info_submit" value="Send Information" class="button-primary" />
or <a href="#" id="n2wp_info_cancel">Cancel</a></p>
<input type="hidden" name="cf_action" id="cf_action_info" value="n2wp_send_info" />
</form>
<div id="n2wp_info_form_response"></div>
<p class="footer">Text and stuff here.</p>
</div>
<div class="clear"></div>
</div>
Text and stuff here.</div>');
$('#n2wp_tab a.tab').click(function() {
$('#n2wp_tab div.content').slideToggle('fast', function() {
if ($.browser.msie && $.browser.version == 6) {
if ($(this).is(':visible')) {
$('select').css('visibility', 'hidden');
}
else {
$('select').css('visibility', 'visible');
}
}
});
return false;
});
$('#n2wp_tab .inner .footer a, #n2wp_tab a.newwin').click(function() {
window.open($(this).attr('href'));
return false;
});
$('#n2wp_tab #n2wp_call_form_toggle, #n2wp_phone_cancel').unbind().click(function() {
$('#n2wp_tab #n2wp_call_form').slideToggle('fast', function() {
$('#n2wp_tab #n2wp_phone:visible').focus();
});
return false;
});
$('#n2wp_tab #n2wp_info_form_toggle, #n2wp_info_cancel').unbind().click(function() {
$('#n2wp_tab #n2wp_info_form').slideToggle('fast');
return false;
});
$('#n2wp_calltime_at_time').click(function() {
$('#n2wp_calltime_at').attr('checked', true);
});
$('#n2wp_call_form').submit(function() {
var form = $(this);
var phone = $('#n2wp_phone');
if (phone.val() == '') {
alert('Please enter your phone number.');
phone.css('background', '#ffc').focus();
return false;
}
$(this).hide();
var target = $('#n2wp_call_form_response');
target.html(n2wp.loading()).show();
$.post(
'index.php',
{
cf_action: 'n2wp_request_call',
phone: phone.val(),
calltime: $(this).find('input[name=n2wp_calltime]:checked').val(),
calltime_at: $('#n2wp_calltime_at_time').val(),
timezone: n2wp.timezone(),
info: $('#n2wp_call_info').val()
},
function(response) {
target.html(response);
$('#n2wp_call_form_response a.button').click(function() {
target.slideUp();
return false;
});
}
);
return false;
});
$('#n2wp_info_form').submit(function() {
var form = $(this);
$(this).hide();
var target = $('#n2wp_info_form_response');
target.html(n2wp.loading()).show();
$.post(
'index.php',
{
cf_action: 'n2wp_send_info',
timezone: n2wp.timezone()
},
function(response) {
target.html(response);
$('#n2wp_info_form_response a.button').click(function() {
target.slideUp();
return false;
});
}
);
return false;
});
if ($.browser.msie && $.browser.version == 6) {
$('#n2wp_tab div.inner').append('
<div class="clear ie6shim" style="height: 1px; overflow: hidden;">&nbsp;</div>
');
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment