<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="Content/redmond/jquery-ui-1.10.3/jquery-ui-1.10.3.custom.min.css" rel="Stylesheet" type="text/css" />
<link href="Content/Site.21.9.84.0.css" rel="Stylesheet" type="text/css" />
<script src="Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.json-2.2.min.js" type="text/javascript"></script>
<script src="Scripts/webchat/webchat.21.9.84.0.js" type="text/javascript"></script>
<a href="#" onclick="display IPFXStartWebChat({ 'host': 'http://webchat.server.com', 'comments': null, 'fields': null, 'graphic1': null, 'graphic2': null, 'email': null, 'phone': null, 'id': null, 'label' : null });">here</a>
In order to auto start web chat window on page load, following javascript needs to be added inside the <head></head> tags. The other option is to add an onclick event to an HTML object.
We have identifier options that enabled email, phone, id and id label to be added to the chat interface. email, phone, id options are null or 0 = off, 1 = visible, 2 = visible and required. label is a text added to the custom identifier
<script type="text/javascript">
$(document).ready(function() {
IPFXStartWebChat({
'host': 'https://mobility.oceanhousing.com/wc',
'comments': null,
'fields': null,
'graphic1': null,
'graphic2': null,
'email': 1,
'phone': 1,
'id': 1,
'label' : null
});
});
</script>
Click here to start WebChat.
In order to create custom form fields following format should be used:
<script type="text/javascript">
//Label Name,Required,Error message displayed to user
var fields = new Array(new Array('Date of birth:', true,'Date of birth is a required field'),new Array('Favourite car:',false));
$(document).ready(function() {
IPFXStartWebChat({
'host': 'https://mobility.oceanhousing.com/wc',
'comments': null,
'fields': fields,
'graphic1': null,
'graphic2': null,
'email': null,
'phone': null,
'id': null,
'label' : null
});
}) ;
</script>
Click here to start WebChat with custom fields attached.
To disable comments field box a third parameter needs to be set to false:
<script type="text/javascript">
$(document).ready(function() {
IPFXStartWebChat(
{'host': 'https://mobility.oceanhousing.com/wc',
'comments': false,
'fields': fields,
'graphic1': null,
'graphic2': null,
'email': null,
'phone': null,
'id': null,
'label' : null}
);
});
</script>
Click here to start WebChat without comments box.
To add a graphic to the start chat dialog or/and chat window then you need to add the graphic names to the 'IPFXStartWebChat' method:
<script type="text/javascript">
$(document).ready(function() { IPFXStartWebChat({
'host': 'https://mobility.oceanhousing.com/wc',
'comments': false,
'fields': null,
'graphic1': 'ipfxlogo.gif',
'graphic2': 'Logo.png',
'email': null,
'phone': null,
'id': null,
'label' : null
});
});
</script>
Click here to start WebChat with graphics.
Enabling chat to launch in new window by supplying a URL to the html page and embed the
<script type="text/javascript">
$(document).ready(function() {
function applicationContextPath() {
if (location.pathname.split('/').length > 1)
return "/" + location.pathname.split('/')[1];
else
return "/";
}
var options = {
'host': applicationContextPath(),
'comments': false,
'fields': null,
'graphic1': null,
'graphic2': null,
'email': null,
'phone': null,
'id': null,
'label' : null
};
IPFXStartWebChat(options);
}) ;
</script>
Click here to start WebChat in a new winwdow.