How to write into a DIV from ASP.NET?

  • (2 Pages)
  • +
  • 1
  • 2

16 Replies - 150471 Views - Last Post: 23 December 2010 - 03:04 AM Rate Topic: -----

#1 netnewb  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 01-February 08

How to write into a DIV from ASP.NET?

Posted 25 February 2008 - 03:07 PM

Hello,
I want to pass an array from ASP.NET to HTML or Javascript. I'm aware that you can do it by creating an ASP literal, a hidden control, or directly passing a variable, but this seems ugly to me. I'd like the data to sit in a plain old hidden div, so human can read it in the source file. The way I'd LIKE to do it is like this:

<div id="passedindata">
data1,data2,data3,data4,data5,
</div>



And in asp.net, I reference the data sequence with
passedindata.InnerHtml


I've written javascript that properly parses the passedindata, but ASP.NET cannot see the div. If I add 'runat="server"' to the div tag, then ASP.NET can use it fine, but asp.net changes the id name of the div, so javascript can no longer see it!

1. How can I make this work?
2. Is this a really wrong way to pass data? If so why?

Thank you.

Is This A Good Question/Topic? 0
  • +

Replies To: How to write into a DIV from ASP.NET?

#2 PsychoCoder  Icon User is offline

  • Google.Sucks.Init(true);
  • member icon

Reputation: 1642
  • View blog
  • Posts: 19,853
  • Joined: 26-July 07

Re: How to write into a DIV from ASP.NET?

Posted 25 February 2008 - 03:16 PM

My first question would be why do you want to do it this way? You say you want the data hidden, but want the user to be able to view source and see it, if thats the case why hide it at all? Normally when someone wants to hide data is it so the user cannot access or read it, so why not just do it the easy way and store it in the View State or in a persistent object?
Was This Post Helpful? 0
  • +
  • -

#3 netnewb  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 01-February 08

Re: How to write into a DIV from ASP.NET?

Posted 25 February 2008 - 03:34 PM

View PostPsychoCoder, on 25 Feb, 2008 - 03:16 PM, said:

My first question would be why do you want to do it this way? You say you want the data hidden, but want the user to be able to view source and see it, if thats the case why hide it at all? Normally when someone wants to hide data is it so the user cannot access or read it, so why not just do it the easy way and store it in the View State or in a persistent object?


The main reason I want to do it that way is that I'd like to reduce the amount of magic data mysteriously flying around--for debugging purposes. If the data lands in a hidden div, I can see it in the html. Why hide it? Because the data is used by javascript.

Secondary reason is that it seems only natural that one should be able to insert their own dynamic html code from asp.net, to be put in a div--without being forced into using/making a control.

I do not understand your references to "the easy way". Easy to me is as I outlined above. I'm not insisting to do it my way, but I see no reason why some automagical way (especially when I don't know what you're talking about) is superior to simply modifying the tag's content, just as I would modify its style if/when I want.

This post has been edited by netnewb: 25 February 2008 - 03:36 PM

Was This Post Helpful? 0
  • +
  • -

#4 PsychoCoder  Icon User is offline

  • Google.Sucks.Init(true);
  • member icon

Reputation: 1642
  • View blog
  • Posts: 19,853
  • Joined: 26-July 07

Re: How to write into a DIV from ASP.NET?

Posted 25 February 2008 - 03:53 PM

Well then, you could just do something like this:


You would have your <DIV> setup like so:


<div id = "MyDiv" style="display:none;"><%# Data1 %></div>




Then to write data to it create yourself a property, like so:


'Property variable
Private _data1 As String
'Now for the property
Public Property Data1 As String
    Get
        Return _data1
    End Get
    Set
        _data1 = Value
    End Set
End Property




Then, whenever you set that property it will be bound to the div we created. And as long as style="display:none;" is present the div isn't visible to the user, but you should be able to see it when you view source
Was This Post Helpful? 0
  • +
  • -

#5 netnewb  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 01-February 08

Re: How to write into a DIV from ASP.NET?

Posted 25 February 2008 - 05:34 PM

View PostPsychoCoder, on 25 Feb, 2008 - 03:53 PM, said:

Well then, you could just do something like this:


No go. It compiles and runs, but the passed-in data is not visible. (Hence, cannot parse it with javascript as intended)

In content page, I have:
<div id="passedindata" style="display:none;">
  <%# DotColorings %>
</div>


The source html code just shows a blank line between the div tags.

In the code behind for the page, I have:

	private string _dotcolors;
	public string DotColorings
	{
		get
		{
			return _dotcolors;
		}
		set
		{
			_dotcolors=value;
		}
	}


And finally, in the Page_Load (asp.net), I have:
DotColorings ="zero,grn,grn,grn,grn,grn,grn,grn,grn,grn,";


-----
Also, my methodology is to build things piecemeal. So I first build the javascript parser, working off some static test data in the div, and after that's working, create the asp.net portion to overwrite the div's contents with the real data. If I could just overwrite the div's .InnerHtml, then this would work perfectly. I could just leave my default/junk/static data in the div, and it would be overwritten by asp.net. But by your method (if it were working), I have to leave the div blank.

If what I'm trying to do is really the wrong way, please tell me why, and what is the best way. Again, please keep in mind that I want to be able to build progressively, piecemeal, preferably without magic data passing. If this methodology is antiquated, please say why.

Also, please tell me how I can do rudimentary debugging on asp.net side. For example, I'd like to call MessageBox (or write to a debug window or whatever) to display the value of DotColorings right after I set it, just to make sure it went ok.

Thank you!
Was This Post Helpful? 0
  • +
  • -

#6 netnewb  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 01-February 08

Re: How to write into a DIV from ASP.NET?

Posted 25 February 2008 - 06:29 PM

I found the problem in the above. Instead of <%# DotColorings %>, I needed to use <%=DotColorings%>
This works to bring in the data. It's acceptable. But my other problem/questions still remain:

Quote

Also, my methodology is to build things piecemeal. So I first build the javascript parser, working off some static test data in the div, and after that's working, create the asp.net portion to overwrite the div's contents with the real data. If I could just overwrite the div's .InnerHtml, then this would work perfectly. I could just leave my default/junk/static data in the div, and it would be overwritten by asp.net. But by your method (if it were working), I have to leave the div blank.

If what I'm trying to do is really the wrong way, please tell me why, and what is the best way. Again, please keep in mind that I want to be able to build progressively, piecemeal, preferably without magic data passing. If this methodology is antiquated, please say why.

Also, please tell me how I can do rudimentary debugging on asp.net side. For example, I'd like to call MessageBox (or write to a debug window or whatever) to display the value of DotColorings right after I set it, just to make sure it went ok.


Can anyone help?
Thank you!
Was This Post Helpful? 0
  • +
  • -

#7 netnewb  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 13
  • Joined: 01-February 08

Re: How to write into a DIV from ASP.NET?

Posted 26 February 2008 - 05:34 PM

BTW, I didn't mean to be rude. Thank you for your help PC.
Is what I'm trying to do really out of the ordinary?
Was This Post Helpful? 0
  • +
  • -

#8 psoosth  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 1
  • Joined: 05-February 09

Re: How to write into a DIV from ASP.NET?

Posted 05 February 2009 - 02:19 AM

Use the following:
<div id="passedindata" style="display:none;" runat="server" > 
</div> 



Then in your asp code you can access the <div> using:

 this.passedindata.InnerHtml = "Hello World"; 


Hope this helps.
Was This Post Helpful? 0
  • +
  • -

#9 eclipsed4utoo  Icon User is offline

  • Not Your Ordinary Programmer
  • member icon

Reputation: 1526
  • View blog
  • Posts: 5,961
  • Joined: 21-March 08

Re: How to write into a DIV from ASP.NET?

Posted 05 February 2009 - 07:27 AM

I routinely use DIVs to show dynamic HTML. I do it just as psoosth said and it works fine(though I show it instead of hiding it).
Was This Post Helpful? 0
  • +
  • -

#10 navyjax2  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 30-January 09

Re: How to write into a DIV from ASP.NET?

Posted 30 September 2009 - 11:21 AM

View Postpsoosth, on 5 Feb, 2009 - 01:19 AM, said:

Use the following:
<div id="passedindata" style="display:none;" runat="server" > 
</div> 



Then in your asp code you can access the <div> using:

 this.passedindata.InnerHtml = "Hello World"; 


Hope this helps.


Can't do it this way if you're trying to do what the original asker wanted - which was to also use the tag from java script: Runat=server takes it away from the client-side. The other solution, while slightly more complex, works better from both sides of the fence (Javascript & ASP .NET).

I found that I needed to remove the "this." to make it work in the way you described, for my instance where I was only using ASP .NET to get/set a value to the DIV control I was using.

-Tom

This post has been edited by navyjax2: 30 September 2009 - 08:23 PM

Was This Post Helpful? 0
  • +
  • -

#11 eclipsed4utoo  Icon User is offline

  • Not Your Ordinary Programmer
  • member icon

Reputation: 1526
  • View blog
  • Posts: 5,961
  • Joined: 21-March 08

Re: How to write into a DIV from ASP.NET?

Posted 30 September 2009 - 12:49 PM

View Postnavyjax2, on 30 Sep, 2009 - 02:21 PM, said:

View Postpsoosth, on 5 Feb, 2009 - 01:19 AM, said:

Use the following:
<div id="passedindata" style="display:none;" runat="server" > 
</div> 



Then in your asp code you can access the <div> using:

 this.passedindata.InnerHtml = "Hello World"; 


Hope this helps.


Can't do it this way if you're trying to do what the original asker wanted - which was to also use the tag from Javascript. Runat=server takes it away from the client-side. The other solution, while slightly more complex, works better from both sides of the fence (Javascript & ASP .NET).

-Tom


I doesn't take it away from the client-side. It just changes the ID. You can't reference it by it's regular ID anymore. You have to reference it by ID that ASP.Net gives it when it's rendered to the browser.
Was This Post Helpful? 0
  • +
  • -

#12 navyjax2  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 30-January 09

Re: How to write into a DIV from ASP.NET?

Posted 30 September 2009 - 08:19 PM

If I recall, that ASP-generated ID is random, and so can't be used. I could be wrong, though, if you've developed a way around that...

-Tom
Was This Post Helpful? 0
  • +
  • -

#13 eclipsed4utoo  Icon User is offline

  • Not Your Ordinary Programmer
  • member icon

Reputation: 1526
  • View blog
  • Posts: 5,961
  • Joined: 21-March 08

Re: How to write into a DIV from ASP.NET?

Posted 01 October 2009 - 05:47 AM

View Postnavyjax2, on 30 Sep, 2009 - 11:19 PM, said:

If I recall, that ASP-generated ID is random, and so can't be used. I could be wrong, though, if you've developed a way around that...

-Tom


as long as it is a static control(not dynamically created) and will always be in the same container, the generated ID will always be the same.

I have done this a number of times where I used javascript to get the control, and I had to hardcode the control's ASP generated-ID into the javascript. but it is still running without issues.

The good thing is, Microsoft is fixing this in ASP.Net 4.0.
http://weblogs.asp.n...d-overview.aspx

Though there are other ways of doing it. Like firing the javascript from the code-behind and passing in the Control.ClientID to the javascript method.
Was This Post Helpful? 0
  • +
  • -

#14 navyjax2  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 30-January 09

Re: How to write into a DIV from ASP.NET?

Posted 17 December 2009 - 06:27 PM

View Posteclipsed4utoo, on 1 Oct, 2009 - 04:47 AM, said:

View Postnavyjax2, on 30 Sep, 2009 - 11:19 PM, said:

If I recall, that ASP-generated ID is random, and so can't be used. I could be wrong, though, if you've developed a way around that...

-Tom


as long as it is a static control(not dynamically created) and will always be in the same container, the generated ID will always be the same.

I have done this a number of times where I used javascript to get the control, and I had to hardcode the control's ASP generated-ID into the javascript. but it is still running without issues.

The good thing is, Microsoft is fixing this in ASP.Net 4.0.
http://weblogs.asp.n...d-overview.aspx

Though there are other ways of doing it. Like firing the javascript from the code-behind and passing in the Control.ClientID to the javascript method.


I saw what you meant - Javascript can reference the same ID as ASP .NET and write to it. The ASP side can do it without even using "this", just the ID and ".InnerHtml". The only issue is if you're trying to reference the field from another class than _Default. How would you do this? I tried encapsulating it in the same namespace and calling the class with _Default defaultClass = new _Default(), but the intelliSense on defaultClass doesn't bring up any public methods/values. Is this by design?

Thanks,
Tom

This post has been edited by navyjax2: 17 December 2009 - 06:28 PM

Was This Post Helpful? 0
  • +
  • -

#15 Guest_Eric Alan Solo*


Reputation:

Re: How to write into a DIV from ASP.NET?

Posted 09 March 2010 - 01:55 AM

you could also use this method, it's the one i use for getting javascript to use the correct id, for each control you want to access from javascript you will need to add a case to the switch.

firstly add this method into your page class.

private string returnClientIDScript()
    {
        System.Text.StringBuilder sb = new System.Text.StringBuilder();
        sb.Append("<script type='text/javascript' > ");
        sb.Append("function getClientId(whichControl)");
        sb.Append("{");
        sb.Append("var cID = '';");
        sb.Append("switch(whichControl)");
        sb.Append("{");
        sb.Append("case 'MYRUNATSERVERCONTROL':");
        sb.Append("cID = '");
        sb.Append(MYRUNATSERVERCONTROL.ClientID);
        sb.Append("';");
        sb.Append("  break;");
        sb.Append("default:");
        sb.Append("  break;");
        sb.Append("}");
        sb.Append("return cID;");
        sb.Append("}");
        sb.Append("</script>");
        return sb.ToString();
    }


what that does is simply make a javascript function that contains the clientID of the server controls, now we are going to add this script to the scriptmanager on page load so if you change the runat server control's id after page load this function will still have the old id, however i dont know why you would want to change the id. so to add it on page load add this into your page load method

ClientScript.RegisterClientScriptBlock(this.GetType(), "", returnClientIDScript(), true);


lastly from javascript you will need to call this function to get the correct id, so...

var MYRUNATSERVERCONTROLId = getClientId('MYRUNATSERVERCONTROL');


then you can get the control by the normal getElementById method using the clientID

document.getElementById(MYRUNATSERVERCONTROLId)


it took me a very long time to work this method of doing it out, but it comes in handy, especially when you want to do javascript validation on runat="server" controls in a form
Was This Post Helpful? 0

  • (2 Pages)
  • +
  • 1
  • 2