DmitryEfimenko
Strange formgroup html
Hi,
In my dev environment the formgroup generates code like this:
<div class=" form-group">
<label class="control-label col-xs-185 col-sm-3" for="Url">Unique URL<span class="required">*</span> </label>
<div class="col-xs--173 col-sm--173 col-md--173">
<input class="UrlInput form-control" data-val="true" data-val-required="The Unique URL field is required." id="Url" name="Url" type="text" value="">
</div>
</div>
Code used...
@using(var form = Html.Bootstrap().Begin(new Form().Type(FormType.Horizontal).LabelWidthSm(3))) {
@form.FormGroup().TextBoxFor(x => x.Url).Class("UrlInput").HelpText(helpText)
}
What am I doing wrong?
Never seen anything like this. Most likely some 3rd party javascript plugin interferes. One way to make sure of that is to check the actual response from the server using chrome dev tools (network tab) and see if the response comes like this or not.
Hi, This problem went away but has just come back. It only happens on my production server. It only happens to Horizontal forms, it is definitely being emitted by TwitterBookstrapMVC. Using version 3.16.2 TwitterBootstrapMVC5
Any ideas what could be causing it? Model
public class TestViewModel : BaseViewModel
{
public string TestName { get; set; }
}
}
View
@model TestViewModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>
@using(var form = Html.Bootstrap().Begin(new Form().Type(FormType.Horizontal).HtmlAttributes(new { enctype = "multipart/form-data" })))
{
@form.FormGroup().TextBoxFor(x => x.TestName)
}
</div>
</body>
</html>
Result (from developer network tab)
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>
<form action="/Test/Index" class="form-horizontal" enctype="multipart/form-data" method="post"><div class=" form-group"><label class="control-label col-xs-138" for="TestName">Test Name<span class="required" style="visibility:hidden;">*</span> </label><div class="col-xs--126 col-sm--126 col-md--126"><input class="form-control" id="TestName" name="TestName" type="text" value="" /><span class="field-validation-valid" data-valmsg-for="TestName" data-valmsg-replace="true"></span></div></div></form> </div>
</body>
</html>
I'm not able to reproduce this. Could you create a sample project showing the issue and send it over to me via email?
Thanks for the response.
It doesn't happen on my dev box, only when I publish it to my production server. I can't recreate it, but neither can I resolve it.
Any ideas where I could start to look? I think it must be some combination of packages but not sure why it doesn't happen all the time?
On 10 November 2015 at 17:16, Dmitry A. Efimenko [email protected] wrote:
I'm not able to reproduce this. Could you create a sample project showing the issue and send it over to me via email?
— Reply to this email directly or view it on GitHub https://github.com/DmitryEfimenko/TwitterBootstrapMvc/issues/394#issuecomment-155493309 .
You could try making sure that all the same dlls are installed. Install them one by one and see if installing any of them results in this issue.
I have a similar issue that is hard to resolve. On form groups on a horizontal form, the only difference between development and production is an extra col-xs-3 in the production div's class. It's enough to make the UI unusable. I've compared dev and prd directories with BeyondCompare see no unusual differences.
It's a problem. So much so, that it's now got a hack. Where is that extra class coming from?
<script type="text/javascript">
$(function () {
$('#contextform div.form-group').attr('class', 'form-group');
});
</script>
I've published my test website to production environment and still didn't see any errors.
do you build your project using production configuration for production? If so, can you build it like that and run in dev environment to see if the issue is there?