I want to use a control like below in my web project (textbox that is editable when double clicked for example). Some suggestions?
Regards.
I found "contenteditable" for div (or other html control).
<div contenteditable="true">This is an editable div.</div>
http://www.w3schools.com/tags/att_global_contenteditable.asp
Thanks
Related
Hi I am working on ASP.NET MVC project. I have textarea in my view where user will get download link to report.
Currently I have this code in my view page :
#if (ViewData["datalink"] != null && !String.IsNullOrEmpty(ViewData["datalink"].ToString()))
{
<textarea class="jquery_ckeditor" cols="65" id="editor1" name="editor1" rows="10">Your report is now available<br />#ViewData["datalink"].ToString()</textarea>
}
For above code output will be like this :
Your automated report is now available
www.test.com
But Instead of showing user directly link, I need to provide text with hyperlink like this :
Your automated report is now available
DownloadLink
How can I achieve this??
This is not possible to do with a textarea. You could use a div construct instead with contenteditable property assigned to it:
<div contenteditable="true"></div>
Which will enable you to place hyperlinks inside + it will give you the same similar functionality as textarea.
Its not fixed content. Your report is now available is editable. User
can edit that.
Instead of TextArea, go for Editor like TinyMCE (with ASP.Net MVC) that will display the content as you need.
I'm trying to implement redactor as a WYSIWYG editor with ruby on rails. Everything seems to be working fine except that when I edit text in the editor the html tags show up. This happens even when I use the html button on the toolbar.
So on the webpage the text appears something like this:
<p>Edited text here</p>
I haven't included any code because I'm not really sure where to begin looking with this so any help at all will be appreciated :)
when using a text editor you have to tell your rails app that the area is html safe.
This is (by default) not the case as people could attack your site by using a text box you have put into your app.
by declaring an area as html safe you should be able to use the html tags as you like.
be aware of the security risk for using this.
e.g.
<div class="description">
<%= #foo.foo_desc.html_safe%>
</div>
Hope this clears it up for you.
in your view try using raw before the text you are trying to show. For example
<%= raw #post.body %>
this will work out with the html tags and show the processed text only without the tags.
I have a Document Type, that has a tab with some properties.
The properties are Upload types, and Simple Editor types.
(Users are supposed to upload images with some image text).
I have not grouped the "Upload" and "Simple Editor" properties, so how do i do this?
Next question,
I want to loop through each group (there should be 3 currently) and display them on my website.
The markup should look like the following:
<div>
<img src="PATH-TO-UPLOAD-TYPE" />
<div>"TEXT FROM SIMPLE EDTIOR TYPE"</div>
</div>
..
<div>
<img src="PATH-TO-UPLOAD-TYPE" />
<div>"TEXT FROM SIMPLE EDTIOR TYPE"</div>
</div>
...
I would like to use Razor for this. Thanks in advance!
For the first part, using the Razor model, you can't. The content object that you get on the front end only contains the properties, the tabs are not included, as they're only really for organising things in the back office.
You CAN get that information using the Umbraco API, but it's pretty database intensive and could potentially be quite slow if you have a lot of properties/tabs.
You'd be better grouping them yourself in your Razor Macro.
for the second part, you can acces the properties of a page via #Model.property. For example:
<div>
<div>#Model.simpleProperty</div>
</div>
(Follows on from Can you define tooltips in Dojo wijit template?)
I'd like to be able to popup some help text if a user hovers or keeps the focus on a Dojo wijit for some time. I know that these wijits come with some prompt behaviours such as when they are empty or on validation errors, but I'd like to be able to prompt regardless of the content of the control. For example:
<input name="tooltipTesting"
data-dojo-attach-point="tooltipMe"
data-dojo-type="dijit.form.ValidationTextBox"
data-dojo-props="placeHolder:'Type Something',
required:true,
value: '${blah}'" />
<div data-dojo-type="dijit.Tooltip" data-dojo-props="connectId:'tooltipMe'">
Got to love hovering over links. Sometimes you a get a free tooltip.
</div>
Programmatic definition of the tooltips works for plain HTML elements like anchors, but nothing I do appears to associate a tooltip with other Dojo controls. Advice?
You can programatically connect the widget to the tooltip using
tooltip.addTarget(widget.domNode);
dijit.Tooltip connects to the DOM node(s), not to Dijit Widgets (i.e. javascript objects), but you can always use widget's reference to its root DOM node accessible via widget.domNode.
There is also a problem with your markup: dojo-dojo-attach-point does not assign an id to the widget (you reference from the Tooltip via connectedId). Define id property <input id="tooltipMe"> to do so, then the ValidationTextBox itself and also the root DOM node of the ValidationTextBox will have the same id. Note that you cannot use hardcoded IDs in the widget templates.
i have xml file created in other asp.net project,these file include some controls and their attributes.i need to show those controls on my mvc project,
xml file format may be like below.
<div style='left:84px;top: 50px;' ><input id='Text1' type='text' value='Mr.Temp'/></div>
<div style='left:8px;top: 50px; position: fixed;' >Name</div>
<div style='left:84px;top: 650px;' ><input id='Text1' type='text' value='30'/></div>
<div style='left:8px;top: 65px; position: fixed;' >Age</div>
<div style='left:84px;top: 90px;' ><input id='Text1' type='text' value='Singapore'/></div>
<div style='left:8px;top: 90px;' >Address</div>
i need to show these controls depend on their type and location like this.
Name Mr.Temp
Age 30
Address Singapore
So,i read xml file and write ,my problem is i can create controls based on their type,but i don't know how to
assign their position correctly?Their old location can't use any more because mine is asp.net mvc project.
Give me right way,please.
regards
Indi
Have you considered using xslt? Then you can write rules around all that.
Or, if you don't want to use xslt, then consider using jQuery and write your own plugin to look through your xml and transform that to html.
edit
Well with a plug in you can check out how to write a jQuery plugin here.
Essentially what you'll be doing is giving the xml to the plugin and then the plugin will generate the html for you.
It's a bit too involved for here but you can "each()" on the div, store the first one, then the second and generate html for the pair then move to the next two.
$(xmlDoc).find("div").each(function(){
//this will get each div. now you need to create html for each and return the
//whole as a string to be rendered.
});