I am using a bootstrap modal popup that contains a Treeview control in the body.
The issue arises when the node's text width exceeds the popup's width, causing the text to overflow outside of the popup.
Is there a way to dynamically adjust the width based on the size of the text?
CS
protected void Page_Load(object sender, EventArgs e)
{
TreeView1.Nodes.Clear();
TreeView1.ExpandAll();
// Add tree nodes
ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "openTreeview();", true);
}
HTML:
<div class="modal fade" id="Div4" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
aria-hidden="true">
<div class="modal-dialog custom-class" id="modalbodyforricheditor">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="H3">Editor</h4>
</div>
<div class="modal-body">
<asp:TreeView ID="TreeView1" runat="server" ShowCheckBoxes="All" SelectAction="none">
</asp:TreeView>
<div>
</div>
<div class="modal-footer">
<div class="row">
<div class="col-md-6 col-md-pull-4">
<asp:LinkButton ID="lbtnUpdateRichTextEditor" runat="server" class="btn btn-default">Update</asp:LinkButton>
</div>
<div class="col-md-6">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Script
function openTreeview() {
$('#Div4').modal('show');
}