Jquery Compatibility Mode

(Note: if id is not working ….user class instead)
Normally javascript built-in functions run in jquery also.
Apply css only on first row of a table:
$(“#free-agent-form table tbody tr td table tbody tr:first td”).css(“background-color”,”#0f0f0f”);
Apply css on all rows of a table except first row:
$(“#free-agent-form table tbody tr td table tbody tr:gt(0) td”).css(“background-color”,”#0f0f0f”);
Make the height of the iframe auto(increase as contents increase):
>> .event_frame == name of the class applied on the iframe tag
$(document).ready(function() {
var theFrame = $(“.event_frame”, parent.document.body);
theFrame.height($(document.body).height() + 30);
});
On click() for any html element : check any other element is hidden or not:
if($(“.term_hierarchical_container .child_of_Medicare”).is(“:hidden”)){
$(“.term_hierarchical_container .child_of_Medicare”).show();
}

Note : this will work for elements that are hidden and shown using .hide() , .show() methods, not using css(‘display’,’none’) OR css(‘display’,’block’);
On click() for any html element : check any other element is visible or not:
if($(“.term_hierarchical_container .child_of_Medicare”).is(“:visible”)){
$(“.term_hierarchical_container .child_of_Medicare”).hide();
}
Note : this will work for elements that are hidden and shown using .hide() , .show() methods, not using css(‘display’,’none’) OR css(‘display’,’block’);

.each() loop in jquery -> same in php is foreach() loop:

jQuery.each(parents_arr, function(i) {});
Here parent_arr is the array name use want to use and “i” is iteration variable starting from 0.

.get url through jquery/ javascript:
• var path_name = window.location.pathname; // return everything before ? and after domain name.
http://nasi-v6.webhop.org/civicrm/contribute/transact?reset=1&id=3&email_add=Email+Address
it will return /civicrm/contribute/transact
• var url = window.location // return complete url of the page.
http://nasi-v6.webhop.org/civicrm/contribute/transact?reset=1&id=3&email_add=Email+Address

• To get everything after “?” in url
var query_string = window.location.search.substring(1);
.Check if the radio button is selected or not:
$(“#edit-field-authors-criteria-value-Single-wrapper input”).attr(“checked”)
Returns true if selected , false otherwise.
.Check if the radio button is not selected

$(‘input[@name=’+element_name+’]’).each(function(){
if($(this).is(‘:not(:checked)’)){
alert($(this).val());
}
});
.Check if the radio button is selected
if(($(‘body.section-questions-list .check_res_when input[@type=radio]:first’).attr(‘checked’))!=null) {
// code here
}
Browse all selected radio buttons
$(this).find(‘input[@type=radio]:checked’).each(function(){
// code here ;
});
$(‘form.send-prop-email-myform input:text’).each(function(){
});

Alternative of explode() of php in jquery:

var split_url = complete_url.split(’email_add’)[1];
Here split_url variable contain second splited array element.
Here taking all splitted array element into one array will generate javascript error.
So take one splitted array element into one variable.
………………………………………………………….
splited_url = “60&reset=1&id=2&amount_other=” (any string)
splited_url.split(‘&reset=1&id=2&amount_other=’)[0]);
it will return 60

To find index of a substring in a string in jquery:

var a = ‘Hello world!’;
document.write(a.indexOf(‘w’))

To uncheck a radio button:
document.getElementById(‘qf_f67a70’).checked=false;
To select a radio button:
$(“input:radio”).attr(“checked”,”checked”);
To check the value of the selected radio button:

$(‘input[@name=baz]:checked’).val())

To select a radio button using name of that radio button:

$(“#Main .form-item .form-layout-compressed tbody tr td input[name=amount]:radio”).attr(“checked”,”checked”);
(In this case only the last option will be selected as all options have same name)
To select a radio button using name & value of that radio button:

$(“#Main .form-item .form-layout-compressed tbody tr td input[name=amount]:radio[@value=641]”).attr(“checked”,”checked”);

Implementing ajax using jquery
Green color code is the file argument , i-e php file you want to call in ajax.
Red colored “data” is the data returned from above php file.
$.get(‘/themes/garland/roll_no_default_value.php?section=’+section+’&class=’+class, function(data) {
$(‘.result’).html(data);
$(“input#edit-field-student-roll-no-0-value”).attr(“value”,data);
});
});
If this is not working : check path of /themes/garland/roll_no_default_value.php?section=’+section+’&class=’+class

How to uncheck & check a checkbox
$(‘input[name=foo]’).attr(‘checked’, true);
>>>>>>>>> and like so to uncheck the box:
1 $(‘input[name=foo]’).attr(‘checked’, false);

Regular expression in jquery

var this_val = jQuery(‘.category_detail_page .view-filters .views-exposed-widget #edit-field-relest-price-veh-value-max-wrapper input#edit-field-relest-price-veh-value-max’).val();
var is_this_val_chars = this_val.match(/[a-zA-Z]+/g);
if(this_val ==”” || this_val ==’Max’){
alert(‘Please enter maximum price’);
}
term_find_label = “’”+ term_find_label;
term_find_label = term_find_label.replace(/[>][ ][-]+/,’> ‘);

Nested parents
$(this).parents(‘li:first’).css(‘background’,’#000′);

Find length of siblings
var total_sib = $(this).parents(‘li:first’).siblings().length;

Check required parent if there are many parents
$(this).parents(‘.donate-info:eq(0)’).css(‘display’,’none’)

How to check if a checkbox is checked or not
$(‘body.page-checkout .left-corner form#uc-cart-checkout-form fieldset#comments-pane .fieldset-wrapper .description:first input.chk_out_terms_box’).click(function(){
if($(this).is(‘:checked’)){
alert(‘checked’);
}
else{
alert(‘un-checked’);
}
});

How to click on a button using jquery
$(‘body.page-donate form#uc-donate-form #donate-page #donate-buttons #edit-add’).trigger(‘click’);
Get value of the selected element in select list on change
$(‘#main_template_cont.page-search-property #edit-prop-search-prop-type-drop-wrapper’).change(function(){
var default_prop_type = $(this).find(‘option:selected’).val();
$(‘#main_template_cont.page-search-property #edit-name-wrapper #edit-name’).attr(‘value’,default_prop_type);
});

Get integers from string :
cart_item_id_val = string variable
edit-edit-delete-100 = this is example string from which I have to get 100 for example
parseInt(/edit-edit-delete-(\d+)/.exec(cart_item_id_val)[1], 10);

How to use confirm box jquery

if (confirm(“Are you sure you wish to delete?”)) {
alert(‘yes’); // do anything if OK button pressed in confirm box
}

How to append a new element inside html
var ul_new = document.createElement( “ul”);
var brand_items = $(‘#block-bean-parnet .bean-list-pic .field-name-field-list-pic .field-items’).children(‘.field-item’).detach();
$(ul_new).append(brand_items);
$(‘#block-bean-parnet .bean-list-pic .field-name-field-list-pic .field-items’).prepend(ul_new);

Was this article helpful?

Related Articles