Codepolice.net » JQuery

Only show the sub menu when the parent is selected with the new wp_nav_menu in WordPress 3.0

Ola — Mon, 28 Jun 2010 14:39:07 +0000

I just spent two hours trying to hide the submenu for a menu item that is not selected in the new menu system in WordPress 3.0. First i found this post in the WordPress forums where someone had built a “Custom Walker” but it was for a slightly different scenario and it was also a really complicated solution. Then i realized that i can do this super simple with jQuery. All you need is two lines of codes.

$(document).ready(function () {
 $(".sub-menu").hide();
 $(".current_page_item .sub-menu, .current_page_parent .sub-menu").show();
 $(".sub-menu li").after("|");
});

This will hide all sub-menus, and then if a parent happens to have the class .current_page_item we show the sub-menu. My god i love jQuery.

Update:

As sushicodeur suggest you could of course do this only with CSS, it’s basically the same thing.

.sub-menu { display: none; }
.current_page_item .sub-menu, .current_page_parent .sub-menu { display: block; }

Convert all checked checkboxes into an comma seperated string with JQuery

Ola — Sat, 07 Nov 2009 15:30:00 +0000

Sometimes i just love jQuery. Well most of the time actually. I did some work for a client a couple of week ago and i needed get all checkoboxes that was checked as a comma seperated list. I started with this code. I found out about the “map” method of jQuery wich has the following description.

Translate all items in an array to another array of items.

The translation function that is provided to this method is called for each item in the array and is passed two arguments: The the item to be translated, and index within the array.The function can then return the translated value, ‘null’ (to remove the item), or an array of values – which will be flattened into the full array.

The code i ended up with looked like this. Really really neat.

ASP.NET postback via JQuery / Javascript

Ola — Wed, 14 Oct 2009 11:35:04 +0000

ASP.NET Webforms isn’t the best platform to build web applications. I can’t wait to migrate my apps to ASP.NET MVC but until i have the time to do that i have to coup with some of asp.net strange parts.

Today i wanted to invoke a postback via JQuery wich actually was fairly easy but i wanted to write a small post about it.

The trick was to get the Javascript that asp.net call to do a postback, save it somewhere and then executed via the eval() method. I used a hidden form to store the postback script.

In the asp.net file

hdnSearchPostBack.Value = Page.ClientScript.GetPostBackEventReference(SearchButton, string.Empty);

In the js file

function() { eval($("#ctl00_ctl00_hdnSearchPostBack").val()); }

Simple as that!

Using JQuery Validation plugin with ASP.NET

Ola — Thu, 09 Oct 2008 13:42:53 +0000

Like everyone else i’ve been playing around with JQuery alot latley. Asp.net and JQuery is not the best friends in the world but i guess it will be alot better when using ASP.NET MVC. Microsoft also annoncued that they will support JQuery natively in future versions. Nice!

If you want to learn more about ASP.NET and Jquery be sure to read both Rick Sthral’s and the Encosia blogs.

I’m working on a new project now where i am trying to stay away from asp.net ajax mainly because of performance reasons but also just because i want to learn something new. Today i’ve been using the JQuery Validation plugin.

There is alot of documentation of how to use it on the the documentation pages for the plugin but i want to share with you one thing that i had problems with.

This is some regular example code that all the sample’s use. The problem here is that for example “EmailTextbox” is not the ID of the control but the name.

$(document).ready(function() {
// validate signup form on keyup and submit
$("#aspnetForm").validate({
rules: {
OpenIdTextbox: "required",
NicknameTextbox: {
required: true,
remote: "resources/nickname.aspx"
},
EmailTextbox: {
required: true,
email: true
}
}
});
});

I scratched my head for a long long time when i used ctl00_ContentPlaceHolder1_EmailTextbox and nothing worked at all. So what you have to do is change this to something like this ..

$(document).ready(function() {
// validate signup form on keyup and submit
$("#aspnetForm").validate({
rules: {
ctl00$ContentPlaceHolder1$OpenIdTextbox: "required",
ctl00$ContentPlaceHolder1$NicknameTextbox: {
required: true,
remote: "resources/nickname.aspx"
},
ctl00$ContentPlaceHolder1$EmailTextbox: {
required: true,
email: true
}
}
});
});

You could of course also use some method that rewrite the Control.UniqueID to a name and use <%= %> to get the name of the control.