IE complains about the comma after the last parameter to Messi.prototype at Line 202. Also the close button remains permanently in position without displaying an X.

Version of IE used was 8.0.6001.18702

Hi,

I have two questions: how do I put a link in the message and how to put a line break?

Thanks in advance.

this code breaks replace it with $(this).parent().data('value');

In IE, Yes and No button placed up and down. Not one in left, one in right. I think it is about CSS.

I've placed a very basic login form within a messi button dialogue:

[code]
$(document).ready(function() {
new Messi('<form name="loginform" id="loginform" method="POST" action="login.php"><p><input name="username" type="text" id="username" size="30" maxlength="30" />Username</p><p><input name="password" type="password" id="password" size="30" maxlength="30" />Password</p></form>',
{title: 'Please Login...',buttons: [{id: 0, label: 'Login', val: 'login'}],callback: function(){ var login = document.getElementById("loginform"); login.submit(); }
});
});
[/code]

no matter what i try i cannot get the call back function to submit the form...

Hi,

I have

setup to display when user clicks on a link eg.:
a href="javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'" title="This week's video"></a

This works well, however I would like to use Messi.ask() to ask the user to confirm to continue. 'Yes' would display the div id="light" class="white_content" and 'No' would not.

Is this possible?

Many thanks :)

Delete this? :-D

I have an Issue in IE (found in IE9)
If autoclose is used, IE complains about undefined variable

Hey, maintainer(s) of marcosesperon/Messi!

We at VersionEye are working hard to keep up the quality of the bower's registry.

We just finished our initial analysis of the quality of the Bower.io registry:

7530 - registered packages, 224 of them doesnt exists anymore;

We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).

Sadly, your library marcosesperon/Messi is one of them.

Can you spare 15 minutes to help us to make Bower better?

Just add a new file bower.json and change attributes.

{
  "name": "marcosesperon/Messi",
  "version": "1.0.0",
  "main": "path/to/main.css",
  "description": "please add it",
  "license": "Eclipse",
  "ignore": [
    ".jshintrc",
    "**/*.txt"
  ],
  "dependencies": {
    "<dependency_name>": "<semantic_version>",
    "<dependency_name>": "<Local_folder>",
    "<dependency_name>": "<package>"
  },
  "devDependencies": {
    "<test-framework-name>": "<version>"
  }
}

Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.

NB! Please validate your bower.json with jsonlint before commiting your updates.

Thank you!

Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!

Would be nice if you put a preloader to load function.
From this:

load: function(url, options) {

options = jQuery.extend(options || {}, {show: true, unload: true, params: {}});

var request = {
  url: url,
  data: options.params,
  dataType: 'html',
  cache: false,
  error: function (request, status, error) {
    console.log(request.responseText);
  },
  success: function(html) {
    //html = jQuery(html);
    new Messi(html, options);
  }
};

jQuery.ajax(request);

}

to this:

load: function(url, options) {

options = jQuery.extend(options || {}, {show: true, unload: true, params: {}});
var loadMessi = new Messi('<div class="messi-preloader"></div>', options);

var request = {
  url: url,
  data: options.params,
  dataType: 'html',
  cache: false,
  error: function (request, status, error) {
    console.log(request.responseText);
  },
  success: $.proxy(function(html) {
    //html = jQuery(html);
    $('.messi-preloader', this.messi).remove();
    $('.messi-content', this.messi).append(html);
            this.resize(); // resize with new content
  }, loadMessi)
};

jQuery.ajax(request);

}

close

Marcos,

I have a project that is using Messi for its dialogs and want to see continued development of this plugin.

If you are not going to continue developing this plugin—perhaps even if you are—consider creating a Messi organization here on Github. Then you could move this repo into that organization and give commit and/or admin rights to people who are dedicated to seeing the plugin grow and succeed.

I would be willing to help with this and I'm convinced that there would be others also willing.

Hi, Great script!

Took me a while to figure out NOT to put messi.js at the bottom of html script (before ) as it says in instructions.
Problem is this, I have a message popup before the user is taken to another page, I would expect the new page to load after the "Ok" button is clicked on the messi message box, but it's not happening that way, the new page loads right after the message is displayed.
Is this a bug, or am I doing something wrong?
This my code:

Any help would be appreciated,
Thank you.

checked samples on your website, no response to taps.

Hi,

I use this in my page:
Messi.load('aboutus.html', {title: 'About Us', titleClass: 'anim info', height: '450px', width: '400px', modal: true, padding: '10px'});

I have some css in 'aboutus.html' and it all seems to work well, except for background-color: which Messi ignores. Is there a way to change the background color of the message box?

CSS:
body{
background-color: #284352;
margin:0;
padding:0;
font:normal 16px/20px Ubuntu, sans-serif;
}

Thank you :)

In IE (i'm testing on IE 9 - hate IE!) I get a strange behaviour with my modal view Messi.

I have a fixed header at the top of my website (100% width about 90px height), position fixed, z-index 1000. When the Messi dialogue should appear what I get is a flickering where my header panel, the overlay and the Messi dialogue box all flicker on and off together as in they appear and disappear rapidly. When the mouse is moved up over my header panel then everything settles and looks as it should do.

I wondered if it was competition for the z-index layer but your default is 99999 so can't be that. Any ideas?

Edit: I removed the modal:true setting to test it and no flickering. So definitely the modal causing this. Hope this helps.

I found there is little problem at line 200
jQuery(window).unbind('resize', function () { this.resize(); }());

I think it should be correct like below:
jQuery(window).unbind('resize', function () { this.resize(); });

For the original code, I got an error (window object didn't have 'resize')

Please confirm.

Many thanks!

Hi,

Whenever I try to assign a css class to a certain button it is not working.

buttons: [
{id: 0, label: 'Cancel', val: 'Y', btnClass: 'bs1'},
{id: 1, label: 'Confirm', val: 'N', btnClass: 'bs2'}
]

This is the code generated by messi.js

Any ideas?

I have added the below 3 line in head section(also kept the files in the folder):

But if i want your pop up with custom button with the code:
new Messi('This is a message with Messi with custom buttons.', {title: 'Buttons', buttons: [{id: 0, label: 'Close', val: 'X'}]});

where do i have to add the code: new Messi()..., if i want to do it for a html button ? and how?

Slightly more guidelines would be useful for us beginners. Thanks in advance.

How to show Static Content in Model with it?

Would be nice if you close the 'messi' when press esc key or click on the modal area.

After _this.modal =.......... add this code

_this.modal.bind('click', function() {
  _this.hide();
});

$(document).keypress(function(event) {
  if (event.keyCode == 27) {
    _this.hide();
  }
});

I use load.messi to display a html file but if I specify 'height:' for the window the content is cut-off at the bottom, so I have to make it 'height: auto' and that throws my whole page out.
Scrolling the contents would be a nice addition :)

Hi!
Like your app..thanks..
Small question:
I open an error message box like this:

new Messi(errorMessage, {title: 'Error', titleClass: 'error', buttons: [{id: 0, label: 'Close', val: 'X'}]});

And in Firefox (v. 25 or 28) the 'Close' button is placed on the left..but in IE, Chrome and Safari it is placed in the middle (like on your site screenshots)..
How can I place this button in the center in FF? )
Thank you!

https://github.com/marcosesperon/Messi/blob/master/messi.js#L258

Assert : http://jsfiddle.net/bzsxC/2/

When I tried the example "Message with custom buttons (yes/no) and callback function", the alert message is "Your selection: Selection Undefined".

I downloaded Messi master from github and used messi.js. I think it is a bug.

Hi,

I am trying to redirect the user to a new page after showing Messi alert.

$.ajax({
type: "POST",
url: "scorecalc.php",
data: {"w":JSON.stringify(sessionStorage)},
cache:false,
success: function(result)
{

                    a = new Messi(result, {title: 'Result',titleClass: 'info',buttons: [{id: 0, label: 'Close', val: 'X'}]});
                  window.location='test_dashboard.php';

              }
    });

The alert doesn't waits to be closed manually before redirecting it to the page.

If I remove the redirect line, alert waits for user interaction.

$.ajax({
type: "POST",
url: "scorecalc.php",
data: {"w":JSON.stringify(sessionStorage)},
cache:false,
success: function(result)
{

                    a = new Messi(result, {title: 'Result',titleClass: 'info',buttons: [{id: 0, label: 'Close', val: 'X'}]});

// window.location='test_dashboard.php';

              }
    });

I want the alert to wait, how should it happen ?

Can you add [, data] to load method? I want to sent the some parameters then I use load method()
such()
Messi.load('multi_upload.php', {'idProj': "11"},
{
title: 'Title',
titleClass: 'info',
width: '500px',
height: '310px',
buttons: [{
id: 0,
label: 'Close',
val: 'X'}]
});

By default, i'm using property "center: true". sometimes it doesn't work and it happens:

Has a work around solution for this?
Thanks

In IE (all version from 7 up to 10) the buttons (yes/no/cancel) appears one above the other and so I can view only the first and a little of the second, even in the on-line demo page.
I solved adding "display: -ms-flexbox;" in CSS .messi-actions {} and "-ms-flex: 1;" in .messi-actions .btnbox {}, it seems that "display:box" does't work for IE.
I add also width:100%; into .messi-actions {} for Firefox to display the buttons as in Chrome, IE and Opera.

I hope this is usefull.

Thank you.

P.S. : Very good work!!! I like it so much!!!

When viewed with Internet Explorer 11, when you click on a Messi link it displays:-

[object Object]

Any idea how you can make it work on this the latest version of IE? I am using Messi v1.3 and jQuery v2.0.3

Thanks for the great library! One issue I am having is with dialogs with multiple buttons. The buttons are right next to each other, not spaced apart like in the demo versions you have on your site. It appears to be a Firefox problem (15.0.1 for Mac). Any suggestions on how to correct it?

It's simple change the code to make possible send some information:

            Messi.load(
                'page.php',{
                    params: { param_1: 'value_1', param_2: 'value_2' }
                }
            );

On messi.js load function:

var request = {
      data: options.params ,
       .....

options = jQuery.extend(options || {}, {show: true, unload: true, params: {}});

should be

options = jQuery.extend({show: true, unload: true, params: {}}, options || {});