Inside a cshtml file I'm trying to configure a #Html.TextAreaFor element
As I want a vertical scroller for a text content. The area should be
fixed size (no rezise)
not allow for user editing (editing of model.HTMLbody is allowed but not on this page)
just list the content with a vertical scrol bar
and set a background color to it
I tried a few variations on below, but so far i'm out of luck
What should the syntax be for this?
#Html.TextAreaFor(model => model.HTMLbody, new { #class = "whatever-class", #cols = 30, #rows = 5 ,#ResizingMode = none})
#Html.TextAreaFor(model => model.HTMLbody, new { style = "cols:80;rows:8;resize:none;" })
(ps in above i dont want to render model.HTMLbody as html )
Related
I have a a web page where various fields are shown or hidden by toggling between "display:block" and "display:none". However, I added some extra stuff to the page and discovered that I needed to special-case several tags: TD needs to use "display:table-cell:, TR needs to use "display:table-row", and so on...
Is there any general off-the-shelf solution to this (i.e. look up the "natural" display type based on the tag name) or am I stuck with creating a JS object by hand which lists tag names and the corresponding display types?
You can apply revert to display property to set the element to it's original value and get the original value by Javascript.
const getOriginalDisplayProperty = (elem) => {
const modifiedDisplayProperty = getDisplayProperty(elem); //store modified display property
elem.style.display = "revert"; //revert to original display property
setTimeout(() => {
elem.style.display = modifiedDisplayProperty; // Again set original display property
}, 0);
return getDisplayProperty(elem);
};
const getDisplayProperty = (elem) =>
window.getComputedStyle(elem, null).display;
getOriginalDisplayProperty(document.querySelector(".test"));
getOriginalDisplayProperty(document.querySelector(".test-span"));
div {
display: inline;
}
span {
display: flex;
}
<div class="test"></div>
<span class="test-span"></span>
I couldnt find an attribute "title" for DropdownListFor and was wondering how to do the same for just the selected item in the dropdownlistFor. My code is
#Html.DropDownListFor(m => m.objDetails.CategoryId, new SelectList(Model.objDetails.Categories, "CategoryId", "CategoryName"), new { id = "cboCategory", style = "width:340px;"} )
Source SO
The built-in DropDownList helper doesn't allow you for setting additional HTML attributes on individual options such as title. You will have to write your own custom helper if you want to achieve that. Here's one example
I am not able to set default text for #HTML.TextAreaFor
This is all I tried, but didn't work, it always shows empty text area
#Html.TextAreaFor(m => m.EmployeeDescription, new { #Text = ViewBag.Model.EmployeeDescription })
#Html.TextAreaFor(m => m.EmployeeDescription, new { #text = ViewBag.Model.EmployeeDescription })
#Html.TextAreaFor(m => m.EmployeeDescription, new { #Value = ViewBag.Model.EmployeeDescription })
#Html.TextAreaFor(m => m.EmployeeDescription, new { #value = ViewBag.Model.EmployeeDescription })
Exactly same thing is working for #Html.TextBoxFor with #Value but not with TextArea :(
Can anybody help...
You should be setting the text on the model before you pass it to the view. This is true for the TextBoxFor as well. You should not have to set the value using HTML attributes. Note that a textarea doesn't have text or value attributes, it's value, when initially rendered, is the HTML between the opening and closing tags.
Found the answer, I was doing a silly mistake
Now I replaced my Index method from this
public ActionResult Index(Guid empId)
{
ViewBag.Model = new EditEmployeePopulator(session, empId).GetModel();
return View();
}
To this
public ActionResult Index(Guid empId)
{
return View(new EditEmpoyeePopulator(session, empId).GetModel());
}
And it worked!
I was doing that in the wrong way earlier. I was assigning my model as a property of ViewBag and was accessing it through ViewBag only in my view and that was my mistake.
When I replaced my code it started working with this only
#Html.TextAreaFor(m => m.EmployeeDescription)
:) :)
Thanks for all the replies
Sorry this by natural of the TextArea element of the HTML itself because if you see the view source you will find the value or the text but for the HTML this not has affect on the TextArea, so to add a default value you need to put text inside the TextArea tag itself
so you can just initialize the object in the creating with your default value as the following:
Employee e = new Employee { Id = 1, EmployeeDescription = "Default Value" };
I'm trying to create a textarea element with a default value with the help of the ASP.NET MVC TextAreaFor method.
<%= Html.TextAreaFor(a => a.Description, new { Class = "gray", rows = "1", cols = "1", #onclick = "clearGray($(this));", Value = "Test sentence" })%>
The box is there, but I don't see the value I set. It appears when inspecting, but not in the textarea. I know you're supposed to set it like <textarea>Test sentence</textarea>, but I don't know how to do that with the helper method.
I tried using a Content attribute, but that didn't work obviously. Any solutions?
Look at ASP.NET MVC - How can I set the Default Value in a Strongly Typed TextArea?
I want to display my radio buttons in 1 line such as:
◎ Option1 ◉ Option2
However with Vaadin I cannot accomplish this it seems like the following,
◎ Option1
◉ Option2
here is my code:
final List<String> options = Arrays.asList(new String[] {
"hebele", "hubele"});
final OptionGroup group = new OptionGroup("", options);
group.setNullSelectionAllowed(false); // user can not 'unselect'
group.select("hubele"); // select this by default
How can i change this?
With Vaadin 7.3, Valo theme supports horizontal OptionGroup without writing custom style:
OptionGroup group = new OptionGroup("", options);
group.addStyleName(ValoTheme.OPTIONGROUP_HORIZONTAL);
As explained in the The Book of Vaadin, you've got to define a theme to setup your own style.css file.
Then you can override the default style for the option to be displayed inline as follow:
.v-app .v-select-optiongroup .v-select-option {
display:inline;
}
I solved this problem like following.
RadioButtonGroup<String> radioGroupGtip = new RadioButtonGroup<>();
radioGroupGtip.getStyle().set("white-space","nowrap");