Issue 168: nyroModal 4.1 resizing problem
Status:  Fixed
Owner: ----
Closed:  Feb 2009
Reported by Mamali.S...@gmail.com, Feb 15, 2009
What steps will reproduce the problem?
1. Open a modal 
2. from the same modal calls another model with differen size
3. The width is not updated

What is the expected output? What do you see instead?
it should resize the new modal.the height is updated ut not the width. the 
old version is working with jquery 1.3.1 


What version of the product are you using? On what operating system?
Jquery 3.1, NyroModal 4.1

Please provide any additional information below.

here is the code generated by nyrmodal fo the second modal windows:

/ Version 1.3.1

<div id="nyroModalFull" style="display: block;">
<div id="nyroModalBg" style="background-color: rgb(51, 51, 204); z-index: 
100; position: fixed; top: 0pt; left: 0pt; height: 100%; width: 100%; 
opacity: 0.75;"/>
<div id="nyroModalWrapper" style="display: block; z-index: 101; position: 
fixed; top: 50%; left: 50%; width: 528px; height: 431px; margin-left: -
268px; margin-top: -219.5px;">
<div class="wrapper">
<div id="nyroModalContent" style="overflow: auto; width: 518px; height: 
421px;">

</div>
</div>
</div>
<div id="nyrModalTmp" style="display: none;"/>
<div id="nyroModalLoading" style="z-index: 102; position: fixed; top: 50%; 
left: 50%; margin-top: -219.5px; margin-left: -268px; display: none; 
width: 528px; height: 431px; opacity: 1;"/>
</div>
 and 
/version 1.4.1 with block option

<div id="nyroModalFull" style="display: block; position: absolute; top: 
16px; left: 253px; width: 1000px; height: 520px;">
<div id="nyroModalBg" style="overflow: hidden; background-color: rgb(51, 
51, 204); position: absolute; top: 0px; left: 0px; height: 100%; width: 
100%; opacity: 0.75;"/>
<div id="nyroModalWrapper" style="position: absolute; top: 50%; left: 50%; 
display: block; width: 386px; height: 458px; margin-top: -233px; margin-
left: -197px;">
<div class="wrapper">
<div id="nyroModalContent" style="overflow: auto; width: 376px; height: 
448px;">
<table id="tblMedia" align="center">
<tbody>
<tr>
<td align="center">
</td>
</tr>
<tr>
<td align="center">
</td>
</tr>
<tr id="BBC">
</tr>
<tr>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div id="nyrModalTmp" style="display: none;"/>
<div id="nyroModalLoading" style="position: absolute; top: 50%; left: 50%; 
margin-top: -233px; margin-left: -197px; display: none; width: 386px; 
height: 458px; opacity: 1;"/>
</div>


Feb 16, 2009
Project Member #1 nyro...@gmail.com
Could you also give your code for opening the first and the second modal please?
Feb 16, 2009
#2 Mamali.S...@gmail.com
MakeTV get information from a web service and call $.nyroModalManual by making the
content with information received from the web services. In the content there is a
drop down list. the change of this dropdown also triggers the MakeTV function. The
second call comes from change event of this ddl. Please let me know if you need
additional information.

MakeTV = function(tvid, tvname) {
    stopTV();
    $.ajaxDotNet('WebServices/TV.asmx/Get_Tv_Info',
            {
                data: { 'tvID': tvid }
                , success: function(ret) {
                    if (ret.Title) {
                        $.nyroModalManual({
                            bgColor: '#3333cc'
                            , content: MakeHtm(ret, tvname)
                            , minWidth: 220
                            , minHeight: 200
                            , modal: true
                            , endShowContent: function(elts, settings) {
                                var ddl = elts.content.find('select');  // drop down
                                var opts = elts.content.find('option'); // option array
                                // Select tvid in ddl, and get focussed
                                opts.filter('[value="' + tvid +
'"]').attr('selected', 'selected').parent('select').focus();
                                //$('#tvlist option[value="' + tvid +
'"]').attr('selected', 'selected');
                                ddl.change(function() { // Call inside of the modal
windows
                                    if (parseInt($(this).val()) == 0) return false;
                                    MakeTV($(this).val(),
$(this).children('[selected]').text());
                                });
                            }
                            , beforeHideContent: function(elts, settings, goback) {
                                // Just stop TV if is IE
                                stopTV();
                                $('#tblMedia').remove();
                                goback();
                            }

                            , endRemove: function() {
                                //Enable buttons
                                $('.button1').each(function() { this.disabled =
false; });
                            }
                            //, 'blocker': '#main_content'
                            //, debug: true

                        }); // nyroModal
                    }
                    else {

                        alert('Network Problems: There is a problem with connection
to database. We\'re working on it. Please try later.');
                    }

                } // success
                , error: function(xhr, st, e) {
                    alert('Network Problems: There is a problem with connection to
database. \nWe\'re working on it. Please try later. \nError : ' + e.Message);
                    $('.button1').each(function() { this.disabled = false; });
                } //Other
            }); // ajaxDotNet
}                              // MakeTV

Feb 16, 2009
Project Member #3 nyro...@gmail.com
In your first message, what did you mean with "version 1.4.1 with block option"?
Did you use the 'blocker' setting?

Then, isn't it possible to see the page in real?

If I well understand, the problem is about how the width is calculate, right?

Feb 16, 2009
#4 Mamali.S...@gmail.com
I tried blocker.is working, but with the same resizing problem as without blocker
option. You are right about width. It's always the same width as the first modal
windows. the high is calculated correctly. I came back to the oldest version.I made a
new page with nyro 4.1 and blocker option at http://soheyli.com/nyroTV.aspx Please
select a button , then in dropdown select BBC is the widest one, and you will see the
problem. Thanks, and let me know if you need additional information.
Feb 16, 2009
Project Member #5 nyro...@gmail.com
ok, it's a bug.
It will be fixed in the next release.

If you don't want to wait it, you could fix it by yourself using the original source
code:
just after the line 1010 (modal.content.css(tmp);)
add
modal.contentWrapper.css(tmp);

and it will fix this issue.

Thanks for your report.
Status: Accepted
Labels: Type-Defect
Feb 16, 2009
#6 Mamali.S...@gmail.com
Thank you I did and it fixed it. 
Feb 17, 2009
Project Member #7 nyro...@gmail.com
 Issue 170  has been merged into this issue.
Feb 19, 2009
Project Member #8 nyro...@gmail.com
the version 1.4.2 now released fix this bug.
Status: Fixed