Trying to retrieve description using jQuery

In the following JSFiddle, I am trying to get the header value from this line

header += '<tr height="30"><td width="33%" align="left"><u><b>' + data[i].catDesc + '</b></u><br></td> in the following section of the code:

Basically, I want to pass the header information in the title of the jQuery UI dialog as shown below (commented part)

$('.hideClass').bind('click',function(){

alert("button clicked");

/*$('#wrapper').dialog({
                            autoOpen: false,
                            title: 'dynamic title goes here',
                             maxHeight: 500,
                            width: 1000,
                            height: 400,
                            modal: true,
                             buttons: {
                            "Print": function() {
                            $(this).dialog("close");
                            },
                            Download: function() {
                            $(this).dialog("close");
                            }}
                        });
 $('#wrapper').dialog('open');*/

});

I tried doing this by adding a div tag and assigning an id as shown below:

header += '<tr height="30"><td width="33%" align="left"><div headerId = "' + data[i].catDesc + '"><u><b>' + data[i].catDesc + '</b></u></div><br></td></tr><tr height="5px"></tr>';

And tried to retrieve it like this in the code :

var title = ($(this).attr('headerId'));

                     console.log("title test");
                     console.log(title);

But I keep getting undefined . Here is the modified JSFiddle with above unsuccessful attempt

Since this refers to window, there is no headerId attribute. Second, don’t make up attributes of your own, they might be dropped. If you need a custom attribute, use data-* attributes. Third, you have the description multiple times, so which one do you want to use?

Ok. Thanks. Basically, I just want the bold headings which are shown in the JSFiddle like First Description when a View button under this description is clicked. Second Description when any of the view button under this description is clicked and so on and so forth.

The general idea here is to traverse up the DOM tree until you get to the description. Unfortunately your HTML is not semantic enough to make that easy.

So, what would be an alternative to achieve this? Should I go ahead and modify the JSON response from the webservice point of view?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.