Rennur
Help with custom form button.
Searching through the forum I have found one post where a custom close tab button was requested
Something went wrong while trying to load the full version of this site. Try hard-refreshing this page to fix the error.
Custom HTML buttons for close form and close tab
aware_support
Try the following in your onclick handler:
onclick="AwareApp.closeComponent(AwareApp.getFormPanel(this), true));"
The last flag should be true if you want Aware IM to automatically perform "go back" operation after closing
Rennur
Thank you support for a quick response,
Try the following in your onclick handler:
onclick="AwareApp.closeComponent(AwareApp.getFormPanel(this), true));"
The last flag should be true if you want Aware IM to automatically perform "go back" operation after closing
Worked. (One to many ")" at the end)
onclick="AwareApp.closeComponent(AwareApp.getFormPanel(this));"Action = Closes current tab.
onclick="AwareApp.closeFormWindow(AwareApp.getFormPanel(this));" Action = Cancels the pop-up window
Below is some custom button CSS & Code for the form's HTML element.
<style type="text/css">
.buttongreen {
display: inline-block;
background: #66ab04;
-webkit-box-shadow: 0px 1px 0px 0px #82ba31 inset, 0px 0px 0px 4px #e6e6e6;
-moz-box-shadow: 0px 1px 0px 0px #82ba31 inset, 0px 0px 0px 4px #e6e6e6;
box-shadow: 0px 1px 0px 0px #82ba31 inset, 0px 0px 0px 4px #e6e6e6;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
text-shadow: 0px 1px 1px #497a03;
padding: 6px 30px;
border-color: #5b9904;
border-width: 1px;
border-style: solid;
font-family: Arial, Helvetica, Sans-serif;
font-size: 14px;
color: #ffffff;
font-weight: bold;
}
.buttonbuttongreen a{font-family: Arial, Helvetica, Sans-serif;
font-size: 14px;
color: #ffffff;
font-weight: bold;
text-decoration: none;
}
.buttonbuttongreen:hover {
background: #9bce00;
-webkit-box-shadow: 0px 1px 0px 0px #add72e inset, 0px 0px 0px 4px #d5efab;
-moz-box-shadow: 0px 1px 0px 0px #add72e inset, 0px 0px 0px 4px #d5efab;
box-shadow: 0px 1px 0px 0px #add72e inset, 0px 0px 0px 4px #d5efab;
text-shadow: 0px 1px 1px #698c00;
border-color: #93c300;
text-decoration: none;
}
.buttonred {
display: inline-block;
background: #f5513c;
-webkit-box-shadow: 0px 1px 0px 0px #ff8272 inset, 0px 0px 0px 4px #e6e6e6;
-moz-box-shadow: 0px 1px 0px 0px #ff8272 inset, 0px 0px 0px 4px #e6e6e6;
box-shadow: 0px 1px 0px 0px #ff8272 inset, 0px 0px 0px 4px #e6e6e6;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-transition: all 0s 0;
-moz-transition: all 0s 0;
-o-transition: all 0s 0;
transition: all 0s 0;
text-shadow: 0px 1px 1px #9c3528;
padding: 6px 30px;
border-color: #ec513c;
border-width: 1px;
border-style: solid;
font-family: Arial, Helvetica, Sans-serif;
font-size: 14px;
color: #ffffff;
font-weight: bold;
text-decoration: none;
}
.buttonred a{font-family: Arial, Helvetica, Sans-serif;
font-size: 14px;
color: #ffffff;
font-weight: bold;
text-decoration: none;
}
.buttonred:hover {
background: #ff6551;
-webkit-box-shadow: 0px 0px 0px 4px #ffbfab;
-moz-box-shadow: 0px 0px 0px 4px #ffbfab;
box-shadow: 0px 0px 0px 4px #ffbfab;
border-color: #ed5e4b;
text-decoration: none;
}
.buttonyellow {
display: inline-block;
background: #ffc835;
-webkit-box-shadow: 0px 1px 0px 0px #ffd564 inset, 0px 0px 0px 4px #e6e6e6;
-moz-box-shadow: 0px 1px 0px 0px #ffd564 inset, 0px 0px 0px 4px #e6e6e6;
box-shadow: 0px 1px 0px 0px #ffd564 inset, 0px 0px 0px 4px #e6e6e6;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
text-shadow: 0px 1px 0px #ffe6a5;
padding: 6px 30px;
border-color: #ebae3e;
border-width: 1px;
border-style: solid;
font-family: Arial, Helvetica, Sans-serfi;
font-size: 14px;
color: #4f2f2f;
font-weight: bold;
}
.buttonyellow a{
font-family: Arial, Helvetica, Sans-serfi;
font-size: 14px;
color: #4f2f2f;
font-weight: bold;
text-decoration: none;
}
.buttonyellow:hover {
background: #ffd200;
-webkit-box-shadow: 0px 1px 0px 0px #ffe04f inset, 0px 0px 0px 4px #ffed99;
-moz-box-shadow: 0px 1px 0px 0px #ffe04f inset, 0px 0px 0px 4px #ffed99;
box-shadow: 0px 1px 0px 0px #ffe04f inset, 0px 0px 0px 4px #ffed99;
border-color: #ffc835;
text-decoration: none;
}
</style>
<div style="margin:5px" class="buttongreen"><a href="#" onclick="AwareApp.saveForm (this)">SAVE</a></div>
<div style="margin:5px" class="buttonred"><a href="#" onclick="AwareApp.closeComponent(AwareApp.getFormPanel(this));">CLOSE</a></div>
<div style="margin:5px" class="buttonred"><a href="#" onclick="AwareApp.closeFormWindow(AwareApp.getFormPanel(this));">CANCEL</a></div>Image of the button found here
customaware
Hi Rennur,
Any idea how one might implement a button on a Presentation for this please?
onclick="AwareApp.closeComponent(AwareApp.getFormPanel(this));"
Tried force feeding it into the Hyperlink of an image button but no go.
Rennur
This should close the tab
<button onClick="AwareApp.closeComponent(AwareApp.getFormPanel(this));" type="button" class="buttongreen" role="button"> Close </button>
customaware
This is on a Presentation Rennur rather than a HTML cell on a form.
Only been able to see options for Link to URL for an Image and the options are
Specify
or
Determined by contents of the tag
Neither will allow that sort of string.
Rennur
Helps to read the post properly :oops:
Try this in the URL
javascript:AwareApp.closeComponent(AwareApp.getFormPanel(this));
customaware
Close but no cigar.
javascript:AwareApp.closeComponent(AwareApp.getFormPanel(this));
actually triggers the opening of a new page in the browser about:blank
Tried changing to
javascript:AwareApp.closeComponent(AwareApp.getFormPanel(this),true);
but no change.
Might just display it in a Pop-Up instead and will then have a close button.