Hello Guys,
I am working on Kendo Pivot grid where URLs are showing as a Row and Months are showing as Column. please see attachment.
Months column values have anchor tag and also URLs row values are having anchor tags.
URLs row have also sub-parts (Webparts) and when i expand webparts then it has some more values like autoform, list viewer and so on.... which are under same URL.
These webparts are having css class expand and collapse applied automatically by
Kendo api.
My requirement is : When i click on Month column value then i am able to get the URL value but when i expand URL and click on Month cell value then i am not able to get same url instead it gives me next row URL value.
Suppose one URL(www.yahoo.com) is having sub-part (Webparts) as Autoform, List Viewer and when i click on Autoform month cell value value then it's giving me next URL value instead it should give me www.yahoo.com. Similarly when i click on List Viewer, then alsom i should give me www.yahoo.com.
JS code is below:-
function ShowUserSkills(value)
{
try
{
var row = $(value).closest("tr");
var rowIdx = $("tr", value.parentElement.parentElement.parentElement.parentElement).index(row);
var colIdx = $("td", row).index($(value).closest("td")) + 1;
var Month = ($("#pivotgrid_url_webparts > table > tbody > tr > td:nth-child(2) > div > div.k-grid.k-widget > div.k-grid-header > div > table > tbody > tr:nth-child(2) > th:nth-child(" + colIdx + ") > span")[0].innerHTML);
$('.k-icon, .k-i-expand').click(function ()
{
try {
var row1 = $(this).closest("tr")
alert('ok');
var rowIdx1 = $("tr").index(row1);
alert('rowIdx1 : ' + rowIdx1);
} catch (e) {
alert(e.message);
}
//if ($(this).hasClass("k-icon k-i-expand"))
//{
// alert('found');
//}
//else
//{
// alert('not found');
//}
});
var URL = ($("#pivotgrid_url_webparts > table > tbody > tr > td:nth-child(1) > div > div.k-grid.k-widget.k-alt").find("tbody").find("a")[rowIdx].innerHTML);
Open_Popup_Window("user_statistics_url.html?eventtime='" + Month + "'&appurl='" + URL + "'", 70, 300);
}
catch (e)
{
alert(e.message);
}
}
<a id="url" href='javascript:ShowUserSkills(this);' onclick="ShowUserSkills(this); return false;" style="font-style: normal; cursor:pointer;">#:dataItem.value #</a>
Please help me out on this.
Thanks !!!!!!!!!!!!
<b>What I have tried:</b>
I tried with javascript code stated above.