<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar.g?targetBlogID\758211560\46blogName\75Tech+Tips,+Tricks+%26+Trivia\46publishMode\75PUBLISH_MODE_BLOGSPOT\46navbarType\75BLUE\46layoutType\75CLASSIC\46searchRoot\75http://mvark.blogspot.com/search\46blogLocale\75en\46v\0752\46homepageUrl\75http://mvark.blogspot.com/\46vt\75-5147029996388199615', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script>

Tech Tips, Tricks & Trivia

by 'Anil' Radhakrishna
A seasoned developer's little discoveries and annotated bookmarks.

Search from over a hundred HOW TO articles, Tips and Tricks


Building a dynamic jQuery Selector for an element whose ID contains braces


For doing some table formatting through jQuery on a table generated dynamically by Sharepoint 2010 in a Web Part, I tried to pick the ID of a table so that I could use it as a selector. I needed to conditionally highlight a cell in each row of a table based on the value of an adjacent cell in the same row.

The problem was, a typical ID value of a table dynamically generated by Sharepoint 2010 for a Web Part looks like this - {8CC7EF38-31D8-4786-8C20-7E6D56E49AE2}-{E60CE5E2-6E64-4350-A884-654B72DA5A53}

Going by the rules, the value of an ID attribute can be only be alpha-numeric & include the underscore and hyphen character.

To simulate the Sharepoint 2010 requirement, I wrote some sample code that has a table with 2 columns and enclosed the ID of a dummy table within braces -
{myTable} 

...and "escaped" the brace character -
\{myTable\}  

...using the following regular expression to get at the rows -
var regex = /[}{]+/g;
var rows = '#' + tableid.replace(re, "\\$&") + ' tbody tr'

That selector now gives me access to the table rows & by looping through the rows I was able to accomplish the conditional highlighting -
$(rows).each(function() { .. }

Labels: ,

Tweet this | Google+ it | Share on FB

« Home | Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »

»

Post a Comment