Grids not showing - asp.net

I have a problem in my local pc with some grids in an asp.net website.
The first image is the testing server, and the grids are showing ok here.
The second image is the same page (sabe website, same vs solution) running on my pc(localhost).
What can be missing in my pc??
Thanks!

My initial thought would be to check whether the CSS file you are linking to is accessible in your local environment. Look in the source view of your web browser. You could also pull up IE Developer Tools (F12) and click the CSS tab.

Related

404 error - File or directory not found. This is happening with certain pages when using Chrome Web Browser

I've been hired into a company that uses ASP.NET for all of their external and internal sites. I'm not too familiar with ASP.NET.
I'm currently working on a external site that runs perfectly in Internet Explorer.
When using the site on chrome, I have certain pages that give me the 404 - File or directory not found.
What can I do to help prevent this error code from showing up when using this site the chrome?
From your description, I understand that your site is a legacy site that is compatible with the IE browser but it is not working properly with modern browsers.
The 404 error information generally informs us that something is not found but if the site works fine in the IE browser then it could be possible that the issue is something else. In that case, this is too little information to predict the cause of the issue.
You may need to provide detailed information about which exact piece of code has the issue. Which version of the Asp.Net project and which kind of project(Web application, web API, etc.) it is. You may need to modify your code or project to make it work with modern browsers including Google Chrome.
At present, if you don't want to make any changes in your code then you could try to use the IE mode in the MS Edge browser to load your legacy site.
You could configure the IE mode manually or using the group policy.
To quickly check it, Launch the Edge browser. Paste edge://settings/defaultBrowser in the address bar and press the Enter key. Add your page to the Internet Explorer mode pages. Visit your site, it should load properly in the IE mode in the Edge browser.

.ASPX pages markups are opening in web browser

When I double click on .aspx pages in my web application project in VS2010, instead of showing the mark up in the ide the .aspx pages are opening in the web browser as shown below. The same is happening when I run my application it opens all the .aspx pages in the web browser along the application url i.e., http://localhost123456/default.aspx. I have to close all the other pages except the http://localhost123456/default.aspx to run/ test my application. Not sure what would cause this to happen. I am not able to find any solutions so far, any help is appreciated. I used the option View Markup (Rightclick on aspx page -> view Markup) to see the markup for now.
Update
As per Mike's answer I checked the options under Open with... and I do have a Internet Explorer (Default) set as shown in the following image. Not sure how did it got there.
Deleting the Internet Explorer (Default) option might be cumbersome if I have lot of .aspx pages , if there is a way to remove this option at once for all .aspx pages rather than right clicking on each and every .aspx and remove it that would be great.
As per #JB King suggestion I did checked the file properties and all the .aspx files are set with Opens with: Microsoft Visual Studio option as shown it the image below.
Right-click any .aspx file in the project, select Open With...
In the screen that pops up, select Web Form Editor, then click the Set as Default button.
Not sure how you got Internet Explorer as an option here, but if it is there, you can just delete it. It's not applicable for loading the aspx from disk. Rather, to see the rendered page in IE, you'd do View in Browser or Browse With... (in which you can set your default browser, as well).
Your address bar shows you're loading files directly from disk. This won't work. ASP.NET is not lilke static HTML. ASP.NET applications must be run from within a webserver. Install IIS and ensure ASP.NET is installed and configured, or use the Debugging Webserver (IIS Express) in Visual Studio.
If you look at the properties of the file, there should be a line of Opens with: that is where you want to have Visual Studio rather than Internet Explorer as the issue is with which programs are mapped to what file extension. Microsoft instructions if you want those as specific steps to do.

Inspecting local html files using WAVE tool

Wave web accessibility tool could be used to inspect webpages to check their compliance with accessibility standards for visually challenged. Is there any way this online tool or its Chrome extension, could be used to inspect html files hosted in local desktop server?
This is an old question, but for the benefit anyone else finding it as I did in a search for the Chrome WAVE extension not working for localhost URLs...
It appears that you need to enable "Allow access to file URLs".
Right click the WAVE icon, click "Manage Extensions" and flip the "Allow access to file URLs" switch.
The Firefox aXe extension https://addons.mozilla.org/en-US/firefox/addon/axe-devtools and the Chrome aXe extension https://chrome.google.com/webstore/detail/axe/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US both allow for analyzing files that are on a server, on a local server and on the local file system.
The aXe rules are newer than the WAVE rules and the instructions that are provided when you click the "more info" link are clear and precise. If you are using WAVE, you should definitely give aXe a test drive.
If you can open the page in a browser, you can use the extension to check the page. I just tried it with both a page running on localhost and a page I opened as just a file on C drive.
I'm using the WAVE add-on in Firefox.
According to their site:
The toolbar can check intranet, password-protected, dynamically generated, or sensitive web pages. Also, because the WAVE toolbar evaluates the rendered version of your page, locally displayed styles and dynamically-generated content from scripts or AJAX can be evaluated.
The online tool, however, requires a public URL.

Strange display behavior with IE8 on localhost vs dev server

Just started a site, using standard html/css - nothing fancy. Just divs to create a framed look. The server code is asp.net (4.0).
When I debug the program locally out of visual studio 2012, the page looks exactly as I designed it in all of my browsers (ie8/ff/chrome). When I publish it to my dev server and open it in IE8, the layout is messed up (i.e, my login box is now at bottom of page instead of center). However, if I open that same page on the dev server with firefox or chrome, it looks correct.
I've tried deleting all the files and republishing. I've viewed the source behind both the working (localhost) and broken (dev server) and it is identical.
Any ideas or additional troubleshooting steps I can try?
Thanks.
Edit:
Screenshot: http://i.imgur.com/tNiIFCz.png (side by side of dev vs localhost)
Masterpage: http://pastebin.com/c94Pinih
Css: http://pastebin.com/Txtac3kw
Login page: (the page that is messed up in IE8): http://pastebin.com/BN5bBamP
You could try:
make sure all of your resources are being loaded correctly (IE8 can do this, but other tools are available)
validating HTML/CSS
checking your render modes locally vs in production. If this is the issue, you can probably use the X-UA-Compatible meta tag to force a specific version of the IE render engine.
checking for any page/script errors
checking that the source in production matches the source when viewed locally
checking differences between IIS
Also by "standard html/css", I assume this is HTML4/CSS2? Do you have a link to check out?
Removed the top level div and it worked. Still not sure why it worked in ie8 on the local box, but not the dev box.

Chrome Dev Tools (CSS) editing and saving

I need to change the color of some words in one category of the widget, I have seen the youtube video about Development Tools.
When I locate the part where I want to change, and I do the change in "Elements" (of Development tools) on the top right corner in the element.style {color:red;
}
but as following the video when I go to resources the changes I made is not there.
I can only edit in Elements, I cant save it
I can only save in Resources, I cant edit/add anything
can someone please help me how this dev tool suppose to work?
I can however edit/add AND save in the Sources, maybe I need to save the style sheet from Resources to Sources? is that what I am suppose to do?
As you said Chrome Dev Tools don't have the builtin function to save the code you edit, anyway there are a couple of Chrome extensions. The best in my opinion is Tincr.
You can find it here Tincr
Then you can also find a tutorial here: http://addyosmani.com/blog/lets-tincr-bi-directional-editing-and-saving-with-the-chrome-devtools/.
Basically you
install the extension,
then you select the application type between: Ruby on Rails, Chrome Extension, Atlassian Plugin and Configuration file,
then you can add the root directory of your project.
When you are done, if you edit something using Google Chrome Dev Tools, the changes will be saved automatically to the source files and there is also a live reload function, so you don't have to press the refresh button or F5 to reload the page after changes.
You cannot edit files on the server through the developer tools and changes will not stay after a refresh.
An updated answer as of March 2013, you can now save changes (JS and CSS, not DOM) from within Dev Tools.
http://remysharp.com/2012/12/21/my-workflow-never-having-to-leave-devtools/

Resources