MuseSearch™ Widget Demo #2 – Using pagination for the result set list

This page shows a JavaScript MuseSearch™ component able to be included in any foreign page. It is exclusively using AJAX calls and works thanks to the Cross-Origin Resource Sharing (CORS) mechanism. The widget works with Muse starting with 2.7.0.0 version and with MuseSearch Application starting with 3.9 version.

The widget is initiated with the “true” value for the USE_PAGINATION option that means the result set list is displayed using numbered pages.

Install files

Installing the MuseSearch™ widget is actually pretty simple. You just need to add the following code to the <head> of your web page:

<link rel="stylesheet" href="http://demo.museglobal.ro/muse/logon/MuseSearch/skins/redmond/jquery-ui.css"/>
<script src="http://demo.museglobal.ro/muse/logon/MuseSearch/javascripts/jquery.js"></script>
<script src="http://demo.museglobal.ro/muse/logon/MuseSearch/javascripts/jquery-ui.js"></script>
<link rel="stylesheet" href="http://demo.museglobal.ro/muse/MSWidget/MSWidget.css"/>
<script src="http://demo.museglobal.ro/muse/MSWidget/MSWidget.js"></script>

This will make sure all the required files are loaded properly.

Add markup

The HTML markup for the MuseSearch™ widget is also very simple. You simply need to create a <div> with an id (EmbededMSWidget in this case).

<div id="EmbededMSWidget" style="width: 400px; height: 400px;"></div>

Hook up the widget

Because the access to Muse Web Bridge is CORS protected, if you want to test this widget against our Muse installation on http://demo.museglobal.ro/muse let us know which is your container web page address (protocol://FQDN:port) so that we add it to our CORS ACLs. If you want to test it against your local Muse 2.7.0.0 Q&A system let us know to provide you with an application patch. Finally you need to hook up the widget by adding the following code after the EmbededMSWidget div we created.

<script>
mSWidget.init({
URL: "http://demo.museglobal.ro/", // Server URL
USER_ID: "MSWidget", // User ID
USER_PWD: "lzOoUwTu7E/UvHCw9KpOsmoEbl4=", // User Password
USER_PWD_ENCRIPTION: "SHA1", // User Pasword Encription. Values: "" | "SHA1"

WIDGET_PLACEDOLDER: "#EmbededMSWidget", // The Placeholder where the Widget will be displayed. Values: body | #ID (The ID of a HTML element such as DIV, SPAN, TD, P)

RESULTS_PER_PAGE: 10, // Results per page
RESULTS_PER_SOURCE: 10, // Results per source
USE_PAGINATION: "true" // Use Pagination. Values: "false" | "true". The "false" value means that an infinite scroll is used for the result set list. The "true" value means that the result set list is displayed in multiple pages.
})
</script>
<script>
$mj(“#EmbededMSWidget”).resizable({
resize: mSWidget.resize,
});
</script>

This entry was posted in Blog, The Muse Platform. Bookmark the permalink.

Leave a Reply

Your e-mail is never published nor shared. Required fields are marked *.

*


*


captcha