function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
asadimasadim 

dataTable id not recognized by jQuery

Hi,

 

If I have a dataTable with id = tableId and use jQuery to access it using $("#tableId") it doesn't work. But when I create the same table using regular HTML tags it works.

 

Anybody know's what's going on?

 

Thanks.

mattdarnoldmattdarnold

Is your table embedded within other Visualforce elements? If so, you need to chain together the ids for those elements. For example, if you had the following:


PageBlock1

   DataTable1 (Enclosed in PageBlock1)

 

You'd reference DataTable1 as follows:

 

document.getElementById('{!$Component.PageBlock1.DataTable1}');

 

(Use the single-quoted text.) Let me know if that works.

 

-- Matt

asadimasadim
You're right. Thanks. But that's not working with jQuery. This is what I use: 
$("#pageid:formid:pageblockid:pbsectionid:tableid")
 
Message Edited by asadim on  01-15-2010 03:00 PM


TehNrdTehNrd
The semi colons visualforce generates makes jQuery not work. It is discussed here:
 
http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_select_an_element_by_an_ID_that_has_characters_used_in_CSS_notation.3F
 
but even the solution provided doesn't always work. What I have done is give elements styleClasses and they use this in the the jQuery selectors. Peformance may not be as great but you don't have to deal with the potential of ids changing. 
Message Edited by TehNrd on  01-18-2010 04:17 PM


SteveBowerSteveBower
Just for reference:


 


 


 


 


// Because Salesforce builds up ID's for it's objects with goofy names concatenated
// together with colons, it becomes difficult to use Name selectors because the ':'
// has meaning to the selector syntax.  So, they must be escaped.
// A helper function to prefix colons in the Id's with backslashes so that they 
// can be used in jQuery selectors
// Usage: $(colonblow('{!$Component.theNewProject}')).dialog('open');
// Note: colonblow = SNL Homage


function colonblow(id) { 
	return '#' + id.replace(/(:)/g,'\\\\$1');
}