nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

The java script onclick doesnot work with confluence 4 ( as it does with confluence 3) and so is CSS

Harihar Pai

Hello All,

This is my html code I post in confluence. I am using the XML RPC to post. All was working fine with confluence 3. Recently we upgraded it to confluence 4.3 and all the problems started. Well the onclick of java script doesnot seem to work and so is the CSS kindly help

********************************

<html>

#outerdiv {

max-width: 90%;

overflow-x: auto;

overflow-y: auto;

margin: auto;

font-family: Calibri;

padding: 0.5em 0.5em 0.5em 0.5em;

text-align:center;

-moz-border-radius: 10px; /* rounded corners */

border-radius: 10px;

background-color: #FDEEF4;

}

table {

margin-left:auto;

margin-right:auto;

border: 1px solid black;

border-collapse: collapse;

}

table tr td, table tr {

border: 1px solid black;

border-collapse: collapse;

}

</style>

function ShowHide(divId)

{

if(document.getElementById(divId).style.display == 'none')

{

document.getElementById(divId).style.display='block';

}

else

{

document.getElementById(divId).style.display = 'none';

}

</script>

</head>

<div id="outerdiv"><caption><h3> Autobild Report </h3> </caption><table border="1" align="center"> <tr> <th>Project</th><th>Project Owner</th><th>Last CL </th> <th> Submit Date </th><th> Failed Count </th> <th> AB History </th><th> HIGH Priority </th><th> LOW Priority </th></tr>

<tr> <td> WEIRONG_TEST_PUT </td> <td>weirong@broadcom.com</td><td> 553151</td><td>2013/08/26</td>

<td> No Records </td>

<tr> <td>1</td><td> ATHENARAY_APPS_PLUS </td></tr>

<tr> <td>2</td><td> COMMS_ATHENARAY_HSPA_NXP </td></tr>

</table></div>

</td>

<td>

X</td>

</tr>

</table></div>

</tr>

</table></div></html>

{html}

***********************************

Thanks and Regards,

Harihar Pai

(Broadcom India)

Accepted answers

All comments

Davin Studer

Well, there are a few issues. First of all you should not be putting in <html>,<head>, and <body> elements into an html macro. That is totally invalid html. The html, head, and body elements are already defined on the confluence page. Secondly, you really should try not to use onclick handlers drectly on the elements. A better way would be to include something like this. This will programatically add the event handler once the page is ready for use. Check out the jQuery documentation for using the click event.

AJS.toInit(function () {

AJS.$('#myanchor').click(function() {
alert( "Handler for .click() called." );
});

});

</script>

<a id="myanchor" href="#" />Stuff</a>

Harihar Pai

Sir,

I did all that you told Its working in my local machine. But when I add AJS. to $ and try to post to confluence it dont seem to work. Below is my code .As its gone critical kindly help me ASAP

</style>
<script>
AJS.$(document).ready(function(){
AJS.$("button").click(function(){
var id = AJS.$(this).attr('id');
AJS.$('#'+id).toggle();
});
});
</script>
<div id="outerdiv"><caption><h3> Autobild Report </h3> </caption><table border="1" align="center"> <tr> <th>Project</th><th>Project Owner</th><th>Last CL </th> <th> Submit Date </th>
<th> Failed Count </th> <th> AB History </th><th> HIGH Priority </th><th> LOW Priority </th></tr>
<tr> <td> WEIRONG_TEST_PUT </td> <td>weirong@broadcom.com</td><td> 553151</td><td>2013/08/26</td>
<td> No Records </td>
<td><Font COLOR="green"> Link </font></td><td>
<div id ="WEIRONG_TEST_PUT-1"><table>
<tr> <td>1</td><td> ATHENARAY_APPS_PLUS </td></tr>
<tr> <td>2</td><td> COMMS_ATHENARAY_HSPA_NXP </td></tr>
</table></div>
<a href="#" class="show_hide" id='WEIRONG_TEST_PUT-1'>2 </button>
</td>
<td>
X</td>
</tr>
</table></div>
</tr>
</table></div>

Thanks and Regards,

Harihar Pai

(Broadcom India)

RambanamP

try with this

&lt;script type="text/javascript"&gt;
jQuery(document).ready(function($) {
	$("#button").click(function(){
		var id = $(this).attr('id');
		$('#'+id).toggle();
		//i think you can try something like 
		$(this).toggle();
	});
});
&lt;/script&gt;

Harihar Pai

Nothing seems to be working please help. I have done this as the laterst code. As there are multiple divs I want to show id the div by its id which is in the link of href. I replaced the AJS.$(document).ready(function() with AJS.toInit(function() still nothing is seems to be working please help me to solve the issue . It is going critical with passing day.

=============================================================

<script>
AJS.toInit(function(){
AJS.$('.show_hide').click(function(){
var id = AJS.$(this).attr('id');
AJS.$('#'+id).toggle();
});
});
</script>
<div id="outerdiv"><caption><h3> Autobild Report </h3> </caption><table border="1" align="center"> <tr> <th>Project</th><th>Project Owner</th><th>Last CL </th> <th> Submit Date </th>
<th> Failed Count </th> <th> AB History </th><th> HIGH Priority </th><th> LOW Priority </th></tr>
<tr> <td> WEIRONG_TEST_PUT </td> <td>weirong@broadcom.com</td><td> 553151</td><td>2013/08/26</td>
<td> No Records </td>
<td><Font COLOR="green"> Link </font></td><td>
<div id ="WEIRONG_TEST_PUT-1" style="DISPLAY: none"><table>
<tr> <td>1</td><td> ATHENARAY_APPS_PLUS </td></tr>
<tr> <td>2</td><td> COMMS_ATHENARAY_HSPA_NXP </td></tr>
</table></div>
<a href="#" class="show_hide" id='WEIRONG_TEST_PUT-1' >2 </a>
</td>
<td>
X</td>
</tr>
</table></div>
</tr>
</table></div>

Harihar Pai

Please can some one help me with above. I am heavily depended on this forum and the task is going critical with each passing day. Please help ASAP

Harihar Pai

I am waiting for some of you to help me. Please do help me to solve this problem.

RambanamP

try with this

&lt;!-- &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt;&lt;/script&gt; --&gt;
 
&lt;div id="outerdiv"&gt;&lt;caption&gt;&lt;h3&gt; Autobild Report &lt;/h3&gt; &lt;/caption&gt;
&lt;table border="1" align="center"&gt;
 &lt;tr&gt; 
	&lt;th&gt;Project&lt;/th&gt;
	&lt;th&gt;Project Owner&lt;/th&gt;
	&lt;th&gt;Last CL &lt;/th&gt; 
	&lt;th&gt; Submit Date &lt;/th&gt;
	&lt;th&gt; Failed Count &lt;/th&gt;
	&lt;th&gt; AB History &lt;/th&gt;
	&lt;th&gt; HIGH Priority &lt;/th&gt;
	&lt;th&gt; LOW Priority &lt;/th&gt;
&lt;/tr&gt;
&lt;tr&gt; 
	&lt;td&gt; WEIRONG_TEST_PUT &lt;/td&gt;
	&lt;td&gt;weirong@broadcom.com&lt;/td&gt;
	&lt;td&gt; 553151&lt;/td&gt;
	&lt;td&gt;2013/08/26&lt;/td&gt;
	&lt;td&gt; No Records &lt;/td&gt;
	&lt;td&gt;&lt;Font COLOR="green"&gt; Link &lt;/font&gt;&lt;/td&gt;
	&lt;td&gt;
		&lt;div id ="WEIRONG_TEST_PUT-1" style="DISPLAY: none"&gt;
			&lt;table&gt;
				&lt;tr&gt; &lt;td&gt;1&lt;/td&gt;&lt;td&gt; ATHENARAY_APPS_PLUS &lt;/td&gt;&lt;/tr&gt;
				&lt;tr&gt; &lt;td&gt;2&lt;/td&gt;&lt;td&gt; COMMS_ATHENARAY_HSPA_NXP &lt;/td&gt;&lt;/tr&gt;
			&lt;/table&gt;
		&lt;/div&gt;
		&lt;a href="#" id='show_hide' &gt;2 &lt;/a&gt;
	&lt;/td&gt;
&lt;td&gt;X&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;&lt;/div&gt;
&lt;/tr&gt;
&lt;/table&gt;&lt;/div&gt;
&lt;script type="text/javascript"&gt;
jQuery(document).ready(function($) {
    $("#show_hide").click(function(){  
		alert("click event");	
        $('#WEIRONG_TEST_PUT-1').toggle();
    });
});
&lt;/script&gt;

let me know is alert is showing or not

Harihar Pai

I got the problem. Its in confluence as I am using confluence2 API (XML-RPC) to post the below to confluence page the below script.

In confluence4 release notes its given

Note: You cannot edit content in wiki markup. Confluence does not store page content in wiki markup. Although you can enter wiki markup into the editor, Confluence will convert it to the rich text editor format immediately. You will not be able to edit the wiki markup after initial entry.It stores in xhtml format

I tried this but still its not working.

============================================================

<?xml version="1.0" encoding="iso-8859-1"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

AJS.toInit(function () {

AJS.$('.show_hide').click(function () {

AJS.$(this).next('div').toggle();

/**

var id = AJS.$(this).attr('id');

AJS.$('#' + id).toggle();

**/

});

</script></head>

<body>

<h3>Autobuild Report</h3>

<table>

<tbody>

<tr>

<th>Project</th>

<th>Project Owner</th>

<th>Submit Date</th>

<th>Failed Count</th>

<th>AB History</th>

<th>HIGH Priority</th>

<th>LOW Priority</th>

</tr>

<tr>

<td>WEIRONG_TEST_PUT</td>

<td>weirong@broadcom.com</td>

<td>No Records</td>

<td>

</td>

<td>

<table>

<tbody>

<tr>

<td>ATHENARAY_APPS_PLUS</td>

</tr>

<tr>

<td>COMMS_ATHENARAY_HSPA_NXP</td>

</tr>

</tbody></table>

</div>

</td>

</tr>

</tbody></table></div></body></html>

=============================================================

This thing if i do directly in confluence it works. But i want to post it from perl script using XML-RPC

===================================================

{html}

AJS.toInit(function () {

AJS.$('.show_hide').click(function () {

AJS.$(this).next('div').toggle();

/**

var id = AJS.$(this).attr('id');

AJS.$('#' + id).toggle();

**/

});

</script></head>

<body>

<h3>Autobuild Report</h3>

<table>

<tbody>

<tr>

<th>Project</th>

<th>Project Owner</th>

<th>Submit Date</th>

<th>Failed Count</th>

<th>AB History</th>

<th>HIGH Priority</th>

<th>LOW Priority</th>

</tr>

<tr>

<td>WEIRONG_TEST_PUT</td>

<td>weirong@broadcom.com</td>

<td>No Records</td>

<td>

</td>

<td>

<table>

<tbody>

<tr>

<td>ATHENARAY_APPS_PLUS</td>

</tr>

<tr>

<td>COMMS_ATHENARAY_HSPA_NXP</td>

</tr>

</tbody></table>

</div>

</td>

</tr>

{html}

This works but I have to post it in to wikimarkup editor.

My actual requirement is to post it using the XML-RPC. So please help me how to post in wikimarkup section using XML-RPC

Now the problem is visible but I am far away from solution Please help!!!!!!!!!!

Sameer V

Thanks to this, I was able to figure out why my dialog pop up was not working!

https://aui.atlassian.com/aui/9.2.0/docs/dialog2.html

Had to enclose the script functions inside

AJS.toInit(function () {

...

});

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

confluence