java - Stopping wicket hyperlink refreshing page -
had redo snippet.i hope it's visible now. new code when select block, change backgroundcolor of td. nee not change color of 1 clicked. here go again.
.active{background-color:red;}<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/tr/rec-html40"> <head> <meta http-equiv="content-type" content="text/html; charset=us-ascii"> <meta name=generator content="microsoft word 12 (filtered medium)"> <link rel="stylesheet" href="fnbstyle.css" type="text/css" media="screen" title="stylesheet" /> <!--[if !mso]><style>v\:* {behavior:url(#default#vml);} o\:* {behavior:url(#default#vml);} w\:* {behavior:url(#default#vml);} .shape {behavior:url(#default#vml);} </style><![endif]--> <title>help desk survey</title> <style> <!-- /* font definitions */ @font-face { font-family: "cambria math"; panose-1: 2 4 5 3 5 4 6 3 2 4; } @font-face { font-family: calibri; panose-1: 2 15 5 2 2 2 4 3 2 4; } @font-face { font-family: tahoma; panose-1: 2 11 6 4 3 5 4 4 2 4; } /* style definitions */ p.msonormal,li.msonormal,div.msonormal { margin: 0cm; margin-bottom: .0001pt; font-size: 12.0pt; font-family: "times new roman", "serif"; } a:link,span.msohyperlink { mso-style-priority: 99; text-decoration: none none; } td.theselection:hover { background:#009999; } <!-- begin snippet: js hide: false -->a:visited,span.msohyperlinkfollowed { mso-style-priority: 99; text-decoration: none none; } td.theselection:active { color:black; } td.red-cell { background: #f00; /* or other color */ } a:hover { background: #009999; -webkit-transition: 1s ease; -moz-transition: 1s ease; -o-transition: 1s ease; -ms-transition: 1s ease; transition: 1s ease; } p { mso-style-priority: 99; mso-margin-top-alt: auto; margin-right: 0cm; mso-margin-bottom-alt: auto; margin-left: 0cm; font-size: 12.0pt; font-family: "times new roman", "serif"; } p.msoacetate,li.msoacetate,div.msoacetate { mso-style-priority: 99; mso-style-link: "balloon text char"; margin: 0cm; margin-bottom: .0001pt; font-size: 8.0pt; font-family: "tahoma", "sans-serif"; } span.balloontextchar { mso-style-name: "balloon text char"; mso-style-priority: 99; mso-style-link: "balloon text"; font-family: "tahoma", "sans-serif"; } span.emailstyle20 { mso-style-type: personal; color: black; } span.emailstyle21 { mso-style-type: personal; font-family: "calibri", "sans-serif"; color: #009999; } span.emailstyle22 { mso-style-type: personal; font-family: "calibri", "sans-serif"; color: #009999; } span.emailstyle23 { mso-style-type: personal; color: white; } span.emailstyle25 { mso-style-type: personal-reply; color: white; } .msochpdefault { mso-style-type: export-only; font-size: 10.0pt; } @page wordsection1 { size: 612.0pt 792.0pt; margin: 72.0pt 72.0pt 72.0pt 72.0pt; } div.wordsection1 { page: wordsection1; } --> </style> </head> <script> function myhelpfunction() { var numbers = [1,2,3,4,5,6,7,8,9,10]; var i; for(i=1; i< 11; i++) { document.getelementbyid("help_cell" + i).style.backgroundcolor = "lightgray"; } } function myagentfunction() { var numbers = [1,2,3,4,5,6,7,8,9,10]; var i; for(i=1; i< 11; i++) { document.getelementbyid("agent_cell" + i).style.backgroundcolor = "lightgray"; } } </script> <!-- <script type="text/javascript"> $( function() { $('td').click( function() { $(this).toggleclass("red-cell"); } ); } ); </script> --> <body lang=en-za link=blue vlink=purple style='margin-top: 5.0pt; margin-bottom: 5.0pt'> <div id="headercontainer"> <div id="logo"></div> </div> <br><br><br><br> <form wicket:id="formsubmit"> <div class=wordsection1> <p class=msonormal> <span style='color: white'><o:p> </o:p> </span> </p> <div> <table class=msonormaltable border=0 cellspacing=0 cellpadding=0 width=700 style='width: 525.0pt'> <tr style='height: 15.0pt'> <td colspan=3 style='padding: 0cm 0cm 0cm 0cm; height: 15.0pt'> <p class=msonormal> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p></td> </tr> <tr> <td width=20 style='width: 15.0pt; padding: 0cm 0cm 0cm 0cm'> <p class=msonormal> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p></td> <td width=660 style='width: 495.0pt; padding: 0cm 0cm 0cm 0cm'> <p> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> procurement desk strives deliver highest level of service, , appreciate if rate recent interaction our agent, selecting appropriate score below. input critical in helping service better. although optional, assist in understanding service provided if can provide comments , details.<o:p></o:p> </span> </p> <p> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <span class="required">*</span> 1. please rate service of fnb procurement desk<o:p></o:p> </span> </p> <div align=center> <table class=msonormaltable border=1 cellpadding=0 width=658 style='width: 493.5pt; background: #f9f9f9; border: solid #009999 1.0pt'> <tr> <td style='border: none; padding: 0cm 0cm 0cm 0cm'> <div align=center> <table class=msonormaltable border=0 cellpadding=0 width="85%" style='width: 85.0%'> <tr style='height: 114.0pt'> <td width="40%" style='width: 40.0%; padding: .75pt .75pt .75pt .75pt; height: 114.0pt'><p class=msonormal align=center style='text-align: center'> <strong><span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'>not likely</span> </strong><span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><br>(not enough) <o:p></o:p> </span> </p> <div align=center> <table class=msonormaltable border=0 cellspacing=0 cellpadding=0 width="80%" style='width: 80.0%'> <tr> <td width="50%" style='width: 50.0%; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> <td style='border: none; border-left: dotted #333333 1.0pt; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> </tr> <tr> <td colspan=2 style='border: dotted #333333 1.0pt; border-bottom: none; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> </tr> </table> </div> <p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222; display: none'><o:p> </o:p> </span> </p> <div align=center> <table class=msonormaltable border=0 cellspacing=5 cellpadding=0 width="100%" style='width: 100.0%'> <tr style='height: 30.0pt'> <td width=30 style='width: 22.5pt; background: #ff0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell1> <p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <a href="#" onclick="myhelpfunction()" wicket:id="help_one"><b> <span style='display:block; font-size: 12.0pt; color: white'>1</span> </b> </a> <o:p></o:p> </span> </p> </td> <td width=30 style='width: 22.5pt; background: #ff0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell2><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_two"><b><span style='display:block; font-size: 12.0pt; color: white'>2</span> </b> </a> <o:p></o:p> </span> </p> </td> <td width=30 style='width: 22.5pt; background: #ff0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell3><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_three"><b><span style='display:block; font-size: 12.0pt; color: white'>3</span> </b> </a> <o:p></o:p> </span> </p> </td> <td width=30 style='width: 22.5pt; background: #ff0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell4><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_four"><b><span style='display:block; font-size: 12.0pt; color: white'>4</span> </b> </a> <o:p></o:p> </span> </p> </td> <td width=30 style='width: 22.5pt; background: #ff0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell5><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_five"><b><span style='display:block; font-size: 12.0pt; color: white'>5</span> </b> </a> <o:p></o:p> </span> </p> </td> <td width=30 style='width: 22.5pt; background: #ff0004; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell6><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_six"><b><span style='display:block; font-size: 12.0pt; color: white'>6</span> </b> </a> <o:p></o:p> </span> </p> </td> </tr> </table> </div> <p class=msonormal align=center style='text-align: center'> <o:p></o:p> </p> </td> <td width="14%" style='width: 14.0%; padding: .75pt .75pt .75pt .75pt; height: 114.0pt'><p class=msonormal align=center style='text-align: center'> <strong><span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'>likely</span> </strong><b><span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><br> </span> </b><span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'>(we can better) <o:p></o:p> </span> </p> <div align=center> <table class=msonormaltable border=0 cellspacing=0 cellpadding=0 width="50%" style='width: 50.0%'> <tr> <td width="50%" style='width: 50.0%; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> <td style='border: none; border-left: dotted #333333 1.0pt; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> </tr> <tr> <td colspan=2 style='border: dotted #333333 1.0pt; border-bottom: none; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> </tr> </table> </div> <p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222; display: none'><o:p> </o:p> </span> </p> <div align=center> <table class=msonormaltable border=0 cellspacing=5 cellpadding=0 width="100%" style='width: 100.0%'> <tr style='height: 30.0pt'> <td width=30 style='width: 22.5pt; background: #ff7f00; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell7><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_seven"><b><span style='display:block; font-size: 12.0pt; color: white'>7</span> </b> </a> <o:p></o:p> </span> </p> </td> <td width=30 style='width: 22.5pt; background: #ff7f00; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell8><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_eight"><b><span style='display:block; font-size: 12.0pt; color: white'>8</span> </b> </a> <o:p></o:p> </span> </p> </td> </tr> </table> </div> <p class=msonormal align=center style='text-align: center'> <o:p></o:p> </p> </td> <td width="13%" style='width: 13.0%; padding: .75pt .75pt .75pt .75pt; height: 114.0pt'><p class=msonormal align=center style='text-align: center'> <strong><span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'>absolutely</span> </strong><span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><br>(we did great) <o:p></o:p> </span> </p> <div align=center> <table class=msonormaltable border=0 cellspacing=0 cellpadding=0 width="50%" style='width: 50.0%'> <tr> <td width="50%" style='width: 50.0%; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> <td style='border: none; border-left: dotted #333333 1.0pt; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> </tr> <tr> <td colspan=2 style='border: dotted #333333 1.0pt; border-bottom: none; padding: 0cm 0cm 0cm 0cm'><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> </tr> </table> </div> <p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222; display: none'><o:p> </o:p> </span> </p> <div align=center> <table class=msonormaltable border=0 cellspacing=5 cellpadding=0 width="100%" style='width: 100.0%'> <tr style='height: 30.0pt'> <td width=30 style='width: 22.5pt; background: #709f32; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell9><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_nine"><b><span style='display:block; font-size: 12.0pt; color: white'>9</span> </b> </a> <o:p></o:p> </span> </p> </td> <td width=30 style='width: 22.5pt; background: #709f32; padding: 0cm 0cm 0cm 0cm; height: 30.0pt' id=help_cell10><p class=msonormal align=center style='text-align: center'> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'><a href="#" onclick="myhelpfunction()" wicket:id="help_ten"><b><span style='display:block; font-size: 12.0pt; color: white'>10</span> </b> </a> <o:p></o:p> </span> </p> </td> </tr> </table> </div> <p class=msonormal align=center style='text-align: center'> <o:p></o:p> </p> </td> </tr> </table> </div> </td> </tr> </table> </div> </td> <td width=20 style='width: 15.0pt; padding: 0cm 0cm 0cm 0cm'><p class=msonormal> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p> </td> </tr> <tr> <td><p></p> </td> </tr> <tr> <td></td> <td> <p> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <span class="required">*</span> 2. please select agent assisted , rate service.<o:p></o:p> </span> </p></td></tr> <tr> <td style='font-size: 10.0pt; font-family: "arial", "serif";'></td> <td><select wicket:id="fromconsultants"></select></td> </tr> <tr style='height: 15.0pt'> <td colspan=3 style='padding: 0cm 0cm 0cm 0cm; height: 15.0pt'> <p class=msonormal> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p></td> </tr> <tr> <td width=20 style='width: 15.0pt; padding: 0cm 0cm 0cm 0cm'> <p class=msonormal> <span style='font-size: 10.0pt; font-family: "arial", "serif"; color: #222222'> <o:p></o:p> </span> </p></td> <td width=660 style='width: 495.0pt; padding: 0cm 0cm 0cm 0cm'> </td> </tr> </table> </div> <p class=msonormal> <o:p> </o:p> </p> </div> <table> <tr> <td style='font-size: 10.0pt; font-family: "arial", "serif";'> please enter details here (optional)</td> </tr> <tr> <td style='font-size: 10.0pt; font-family: "arial", "serif";'> employee number:</td> <td><input type="text" wicket:id="empnumber" size="42" /></td> </tr> <tr> <td style='font-size: 10.0pt; font-family: "arial", "serif";'> employee name:</td> <td><input type="text" wicket:id="empname" size="42" /></td> </tr> <tr> <td style='font-size: 10.0pt; font-family: "arial", "serif";'> business unit:</td> <td><input type="text" wicket:id="bu" size="42" /></td> </tr> </table > <table > <tr> <td style='font-size: 10.0pt; font-family: "arial", "serif";'> comment:</td> </tr> <tr> <td> <textarea cols=90 rows=4 wicket:id="comment"></textarea></td> </tr> </table> <table> <tr> <td><div wicket:id="feedbackpanel"></div></td> </tr> <tr> <td><input type="submit" value="submit" id="submit"></td> </tr> </table> </form> </body> </html>
you need use wicket ajaxlink component. or don't use wicket component @ all.
normal (i.e. non-ajax) link "refresh" page because sends request executes link's #onclick() method , whole page refreshed show outcome of click. can use javascript suppress default behavior of <a> need link in page?! can use plain javascript change colors on client side. use #renderhead(iheaderresponse) contribute your.js file binds event listeners , work.
Comments
Post a Comment