Solved

Cannot access contenteditable div tag value in a datagrid

Posted on 2003-11-19
13
885 Views
Last Modified: 2012-08-13
I am building a content management system and am using the MSHTML editing platform. Basically I have a contenteditable div tag where the user can perform basic word processing functions, like bold, italics and add links. The contenteditable div tag is being dynamically filled and placed on the page using a DataGrid (the contenteditable div is inside of  a <edititemtemplate>). Also inside of the same edititemtemplate column is 3 other server controls (<asp:textbox>). This DataGrid also has an editcommandcolumn with an Edit, Update and Cancel button. Once the Update button is clicked I need to be able to grab the new text (using an Update subroutine) that is inside of the contenteditable div tag as well as all of the other server controls. So far, I can easily access the textbox's data by using:
 
Dim strDayTitle as String = CType(E.Item.FindControl("txtboxDayTitle"), TextBox).Text

I've tried accessing the contenteditable div tag's data by using:

Dim strDayText as String = CType(E.Item.FindControl("oDiv"), HtmlGenericControl).InnerHtml

But I keep receiving this error, "System.NullReferenceException: Object reference not set to an instance of an object." I've even tried this:

Dim strDayText as String = oDiv.InnerHtml

But I keep receiving the same error as above. How do I get the InnerHtml value out of a div tag in a DataGrid?

Thanks for your thoughts,

-Shamus
0
Comment
Question by:shammyd
  • 6
  • 5
13 Comments
 
LVL 12

Expert Comment

by:roverm
ID: 9787135
You could try to dig a little deeper into the datagrid (and the locals window in debugmode):

Dim obj As TextBox = DataGrid1.Items(e.Item.ItemIndex).Cells(4).FindControl("txtboxDayTitle")

Of course, you need to change the Cells(4) into the column number the DIV tag is in.

D'Mzz!
RoverM

0
 
LVL 12

Expert Comment

by:roverm
ID: 9816619
Any progress here?
0
 

Author Comment

by:shammyd
ID: 9819322
Roverm, I tried your suggestions, but they didn't work either.... but I think I figured out why. The div tag that I need to get the data from, because it isn't a server control, hasn't been instantiated yet, so upon postback there is no "oDiv" object! Now I just need to figure out how to either build the contenteditable div structure into a custom server control (and add it's contents to viewstate) or have a Page Unload subroutine run and pass the div's data into something that I can access.

Thanks for you response. I will post a solution once I figure out what I am going to do...

-Shamus

0
 
LVL 12

Expert Comment

by:roverm
ID: 9819367
That's correct. I guessed that you used a server control.
What about placing a TextBox (Textmode = multiline) inside the DIV? This way you can use a serverside control.
0
 

Author Comment

by:shammyd
ID: 9819463
That is a good idea, but if I did that I wouldn't be able to use the word processing features (bold, italics, adding links, etc) that the contenteditable div tag provides. I've wanted to look into creating the div tag on the server side via some server control (asp:literal or asp:label or etc), but it looks like most of these controls use a span tag, and I need a div tag so I can add the contenteditable attribute to it.

What a mess...
0
 
LVL 12

Accepted Solution

by:
roverm earned 125 total points
ID: 9820303
You can have bold etc. in a textarea (that is a multiline textbox).
Take a look here:
http://www.interactivetools.com/products/htmlarea/

D'Mzz!
RoverM
0
Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

 

Author Comment

by:shammyd
ID: 9820759
Hmmmm, that is very interesting! I wasn't aware that you could build a textarea that can bold, italics, etc. What I created was, again, using the contenteditable attribute of the div tag, as laid out in this tutorial:

http://msdn.microsoft.com/library/default.asp?url=/workshop/browser/mshtml/overview/mshtml_editing_ovw_entry.asp

Now, I just need to see if I can add this to an asp.net server control (asp:textbox with multiline). I will write back and let you know if I get it working... and if it works you definately deserve the points!

Thanks for your time.
0
 
LVL 12

Expert Comment

by:roverm
ID: 9821001
If you need some help in getting the HTMLArea to work just let me know.
I've used it a lot! ;-)
0
 

Author Comment

by:shammyd
ID: 9826907
Just a quick update... I first created a page to test if I could use an asp:textbox with TextMode="MultiLine" to create the HTMLArea, and sure enough, it works! Then I tried to add the code to my DataGrid... unfortunately .NET changes the name attribute of the textarea once it is placed in the DataGrid from "txtboxDayText" to "myDataGrid:_ctl2:txtboxDayText" (where the ctl2 changes according to which textarea I choose), so the editor_generate() function call at first wouldn't work. So I added a RegisterStartupScript() function like this:

' Create a reference to the TextArea
Dim myTextBox as TextBox = myDataGrid.Items(e.Item.ItemIndex).Cells(2).FindControl("txtboxDayText")

'Set the script
RegisterStartupScript("editorGenerate", "<script language=""JavaScript1.2"" defer>" & vbCrLf & vbTab & "editor_generate('" & myTextbox.UniqueID &"');" & vbCrLf & "<" & "/script>")

Now editor_generate() has the correct name for the textarea (verified by viewing the source code), so it should work... but it doesn't.

Here is the current problem as I see it: HTMLArea code uses the name attribute of the textarea (myDataGrid:_ctl2:txtboxDayText) and the .NET name attribute now has colons in it and colons are not legal characters in JavaScript for objects. Only the underscore, characters and numbers are allowed, at least I thnk this is the rule. The textarea's id attribute would work just fine since it has no colons (myDataGrid__ctl2_txtboxDayText), but the HTML script specifies that it uses the name attribute!

Right now I am trying to figure out how to change the HTMLArea script to use the id attribute instead of the name. Rewriting RegisterStartupScript() will be easy; I just need to change myTextbox.UniqueID to myTextbox.ClientID and now it will reference the id attribute.

This is proving difficult...
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 10268208
No comment has been added lately, so it's time to clean up this TA.
I will leave the following recommendation for this question in the Cleanup topic area:

Accept: roverm {http:#9820303}

Please leave any comments here within the next seven days.
PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!

TheLearnedOne
EE Cleanup Volunteer
0
 

Author Comment

by:shammyd
ID: 10273007
The solution that roverm gave didn't work, but I was able to use a free .NET Rich Text Box control to do what I needed. Here is a link to the control:

http://www.asp.net/ControlGallery/ControlDetail.aspx?Control=1205&tabindex=2

I hope this helps anyone with the same problem!

-Shamus
0
 
LVL 12

Expert Comment

by:roverm
ID: 10276349
Shamus,thanks for sharing your solution!
I would like to suggest a PAQ/Refund here.

D'Mzz!
RoverM
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

The object model of .Net can be overwhelming at times – so overwhelming that quite trivial tasks often take hours of research. In this case, the task at hand was to populate the datagrid from SQL Server database in Visual Studio 2008 Windows applica…
Recently while returning home from work my wife (another .NET developer) was murmuring something. On further poking she said that she has been assigned a task where she has to serialize and deserialize objects and she is afraid of serialization. Wha…
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…

706 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now