How can I debug my MVC3 site using Chrome?
I am creating an ASP.NET MVC3 website. I have javascript in my .cshtml file:
<div>hello!</div>
<script type="text/javascript">
$(document).ready(function () { alert("ready!"); })
</script>
Google Chrome's built-in debugger doesn't see this javascript snippet, so I can't debug it.
How do I set a breakpoint in this javascript snippet in Google Chrome's built-in debugger?
source to share
In MVC3, by running the razor view engine, I had bindings that really messed up parsing the view.
For example, if you have:
@using(Html.BeginForm()){
<div>hello!</div>
<script type="text/javascript">
$(document).ready(function () { alert("ready!"); });
</script>
}
You may have problems with the script brackets. Try changing it to:
@{ Html.BeginForm(); }
<div>hello!</div>
<script type="text/javascript">
$(document).ready(function () {
alert("ready!");
});
</script>
@{ Html.EndForm(); }
This may or may not be the answer to your question, but it took me forever to figure out what was wrong with some of my forms. I didn't put scripts in them, though .. they were blocks for conditional logic that would break everything for me.
EDIT After doing a little research, I found that one of them led me to a solution: aspnet.codeplex.com/workitem/7551.
My commit post (from a codebase that I don't physically have access to) suggests it might be bad markup. The developer who wrote the offending pages liked to use the header tags even though we used the XHTML 1.1 doctype. It also had a lot of attributes that were conditionally compiled and / or populated. For example:
<div class="something @myHelper(someFlag)"></div>
<div @{ isSomeFlag ? <text>class="asdf"</text> : "" }></div>
My solution should be considered a temporary solution.
source to share