I have following cshtml view page with div sections
@model IEnumerable<int>
@{
ViewBag.Title = "Template";
}
<!DOCTYPE html>
<html>
<head>
<title>Create a Template</title>
</head>
<body>
<div>Bank Brochure</div>
<div>Solution by ggg.</div>
</body>
</html>
I want to make this cshtml page div sections editable ,how can I do this
May it will helps you
$('#button').on('click',function(){
$('#divvalue').html($('#editableddiv').text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<input type='button' id='button' value='Get Div value' />
<div> div value : <div id='divvalue'></div> </div>
<div id='editableddiv' contentEditable='True' style='Height:200px; width:200px;border:1px solid'>
Editable Div
</div>
Update:
To get the editable div value in JQuery and JavaScript
var div_value = $('#editableddiv').text();
var div_value = document.getElementById('editableddiv').innerHTML;
You need to be more specific.
if 'Editable' means Html Editable, you can consider using an opensource WYSIWYG editor instance like CKEditor.
If you want to just show your content normally, but want to make that div editable, you can use the contenteditable="true"
attribute for your div:
<div class="someClass" id="someId" contenteditable="true"> ... </div>
If all you want is to provide an editable text area, you can use MVC's helper functions to do that:
<div class="someClass">
@Html.TextAreaFor(m => m.YourModelProperty)
</div>
You can check the MSDN reference to see how to properly use this.