asked on

Dialog works but when using some computers writing is sqashed to right hand side

Hello experts again,
I have built a new app for our office intranet and we are going through the test stages. I use IE10 and use the developer tools to use different browser modes (nearly always IE9) and using my computer and IE10 in IE9 mode I open up the dialog and it looks great got a few testers to try it, most came back saying yes they were happy with it (using IE 9) but 2 came back saying the writing in the dialog was squashed over to the right with a scroll bar so you could see all the writing and textboxes and they were using IE9.
I have no idea what might be causing it especially when it works for 4 other testers.
Any help would be highly appreciated.
Thanks in advance

Julian Hansen

This is like phoning the mechanic and saying my car is broken what is the problem.

Some code would be a good start - or a link if you can.

At the very a least a screen shot.

IE9 is not exactly the most compliant browser out there - the fact that it is misbehaving is not really a surprise. Bear in mind that the number of people still using IE9 is very small - although I gather from your post that you are probably constrained by browsers deployed in your office.

For us to help you though we need something to work with - preferably the html code that generates the page (as it appears in the browser)

Niall Gallagher

ASKER

Julian,
I apologise for taking so long to get back. Firstly I changed when I load the div in the dialog and it seems to have done the trick, but if I open the dialog multiple times or sometimes the first time I open it, it is all greyed out

function GetEditAssoc($PersonID) { 
            personID = $PersonID;
            $.ajax({
                cache: false,
                type: "GET",   
                url: "@Url.Action("Edit", "Home")",
                data: { id: personID },
                dataType: "html",
                success: function (content) {    
                    $("#edialog").dialog({ 
                        hide: "explode",
                        autoOpen: false,
                        modal: true,
                        width: 545,
                        resizable: false,
                        title: "Edit Details",  
                        open: function (event, ui) {     
                        }
                    });
                    $("#iedialog").html(content);
                    $('#edialog').dialog('open');
                    return false;
                }
            });

Open in new window

ASKER CERTIFIED SOLUTION

Julian Hansen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Julian Hansen

I tested the above back to IE8 (Actual not emulated) - seems to work ok?

If that works you need to look at the markup that is in the popup - it might the browser is not interpreting that correctly.

Niall Gallagher

ASKER

Again thanks for your help. This is the way I have always done it.

I have a div called edialog for the dialog to open in and another div called iedialog inside edialog which will show a partial view. but maybe that's not the way to it anymore it's just I got used to it

<div class="edialog">
<div class="iedialog">
</div
</div>

Julian Hansen

OIC, nothing really wrong with that. Personally I am not a fan of JQueryUI dialogs - they used to be great when they were the best around but things have moved on. Nothing wrong with the way you are doing it though - often the case you need a frame and the content is not inserted directly into the dialog HTML.

Back to the question of whether or not the sample posted has the same problems as your application?

Niall Gallagher

ASKER

Your sample seems to work great. Let me look into it a bit more and see if anything catches my eye.

Thanks