You are currently browsing the archives for the Code category.
http://jsperf.com/prop-vs-ischecked/4
Fastest by 98% is $el[0].checked; (in Chrome on Windows)
[code]// These will return true or false depending on the checked state of the HTML element
$(‘:checkbox[name=someCheckbox]’)[0].checked
$(‘:radio[name=someRadio]’)[0].checked[/code]
Tags: html, javascript, jquery
Posted in Code | No Comments »
If you intercept the form submit with some jQuery and find that you can’t trigger the submit yourself with your script, you may need to check the name of your submit button. If you have a submit button named submit, jQuery will not be able to submit that form. You may also see the error “Uncaught TypeError: Property ‘submit’ of object #
The fix is simple of course. Change the button name.
Wrong: [code]<input type="submit" name="submit" id="confirm" value="Confirm">[/code]
Right: [code]<input type="submit" name="confirm" id="confirm" value="Confirm">[/code]
Hope that helps someone else.
Tags: form, input, jquery, submit
Posted in Code | No Comments »
Based on the awesome work done here Samson PHP Color Gradient Generator, I have packed up his code into two functions that are by default set to generate heatmap blue to red color gradients, in as many steps as you need.
https://gist.github.com/bendauphinee/10472641
[php]function heatSteps($config){
$config[‘colorStart’] = (isset($config[‘colorStart’])) ? hexdec($config[‘colorStart’]) : 0xdee7f8;
$config[‘colorEnd’] = (isset($config[‘colorEnd’])) ? hexdec($config[‘colorEnd’]) : 0xff0f15;
$config[‘colorSteps’] = (isset($config[‘colorSteps’])) ? $config[‘colorSteps’] : 10;
$config[‘colorStart’] = (($config[‘colorStart’] >= 0x000000) && ($config[‘colorStart’] <= 0xffffff)) ? $config[‘colorStart’] : 0x000000;
$config[‘colorEnd’] = (($config[‘colorEnd’] >= 0x000000) && ($config[‘colorEnd’] <= 0xffffff)) ? $config[‘colorEnd’] : 0xffffff;
$config[‘colorSteps’] = (($config[‘colorSteps’] > 0) && ($config[‘colorSteps’] < 256)) ? $config[‘colorSteps’] : 256;
$theR0 = ($config[‘colorStart’] & 0xff0000) >> 16;
$theG0 = ($config[‘colorStart’] & 0x00ff00) >> 8;
$theB0 = ($config[‘colorStart’] & 0x0000ff) >> 0;
$theR1 = ($config[‘colorEnd’] & 0xff0000) >> 16;
$theG1 = ($config[‘colorEnd’] & 0x00ff00) >> 8;
$theB1 = ($config[‘colorEnd’] & 0x0000ff) >> 0;
$colorSteps = array();
for($i = 0; $i <= $config[‘colorSteps’]; $i++){
$theR = interpolateHeatSteps($theR0, $theR1, $i, $config[‘colorSteps’]);
$theG = interpolateHeatSteps($theG0, $theG1, $i, $config[‘colorSteps’]);
$theB = interpolateHeatSteps($theB0, $theB1, $i, $config[‘colorSteps’]);
$colorSteps[] = dechex(((($theR << 8) | $theG) << 8) | $theB);
}
return($colorSteps);
}
function interpolateHeatSteps($pBegin, $pEnd, $pStep, $pMax){
if ($pBegin < $pEnd){
return(($pEnd – $pBegin) * ($pStep / $pMax)) + $pBegin;
}else{
return(($pBegin – $pEnd) * (1 – ($pStep / $pMax))) + $pEnd;
}
}[/php]
Tags: Code, colors, css, gradient, heatmap, hex, php
Posted in Code | No Comments »
Today I had a task come up on my list that I’ve been interested in digging into for a while. After seeing the reddit π icon, and learning that it’s awesome, as well as reference to the movie The Net, I wanted to make use of the idea to hold some info on page generation times and a few other things useful as a dev on a site I’m working on.
So, digging in with Chrome’s developer tools, I looked into figuring out how to do it. At first, I thought it was a Javascript thing, using jQuery and mouseOver events, because that’s how it could have been done. However, that seemed a little heavy for this purpose, since it’d require some Javascript be loaded on each load. So, examining it a bit closer, I dug into the CSS, and discovered a new use of the pseudo property :hover.
Today I learned that you can use :hover on a parent element to change properties on a child element. Of course, it makes perfect sense now to use it like that, but it was one of those Ooohhhh! moments that you get when something obvious smacks you in the face.
Here’s one way to do the reddit π icon:
[code]
<style type="text/css">
#pibottom{float: right; padding-top: 4px;}
#pi{color: #a0a0a0; font: 16pt serif; padding: 2px;}
#picontent{font-size: 11pt; display: none;}
#pibottom:hover #picontent{display:inline;}
</style>
<br clear="all">
<div id="pibottom">
<span id="pi">π</span> <span id="picontent">Load in ‘ . getScriptTiming() . ‘ sec. Ran ‘ . getCountDBQueries() . ‘ queries.</span>
</div>
[/code]
Tags: Code, css, javascript, jquery, pi, reddit, webdev
Posted in Code | No Comments »
Thanks goes to VNSMANIAN2006 for the code for a quick top and bottom pagination element with jQuery Pagination. The original note can be found here: http://plugins.jquery.com/node/8360#comment-4157
And here is how I used it:
[code]
$(document).ready(function(){
$.get("ajax.php?getcount=1", {}, function(data){
$("#pagination").pagination(data, {
num_edge_entries: 2, num_display_entries: 6, items_per_page: 20,
next_show_always: false, prev_show_always: false,
callback: function(page_index, jp){
$.get("ajax.php?p="+page_index, {}, function(data){
$("#paginationb").empty();
$("#pagination").clone(true).prependTo("#paginationb");
$("#reportInfo").empty().append(data);
});
return false;
}
});
});
});[/code]
And all I did was add the #paginationb div below the table.
Tags: Code, development, javascript, jquery, js, pagination, programming
Posted in Code | No Comments »