How do make the best colorpicker option ... hopefully with AJAX

  • Thread starter Thread starter Mikael Syska
  • Start date Start date
M

Mikael Syska

Hi,

I have a problem ...:
If you look at http://syska.dk/upload/eb-14.jpeg you can see some names
to the right ... Alexandro, syska, resurrected.

I want an option to pick a new color for the name when clicking it.

I have a panel with 216 different colors, put into a <table>

But I can't figure out how to make it ... so that I know witch name was
clicked and still get the colorId ...

Also I want to have the "player list" in a updatePanel as I want to use
AJAX ....

I thought it was simple, but I can't figure out, how to do it ...

best regards
Mikael Syska
 
somthing like this, this will solve the clicnt side of the problem if I
understand it.
to send to the server can be solver by adding the values to a hidden field
and retrived on a future event, or you can send via the
ICallbackEventHandler. I have a sample on how to do this.
http://dev.thatsit.net.au/samples/aspnet/postback/default.aspx


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
<!--

function window_onload() {
var tds =
document.getElementById('colorPicker').getElementsByTagName('TD')
for (i = 0;i<tds.length;i++){
tds.onclick = tabClick
}
}

function tabClick(){
var name = this.innerText
var bgColor = this.style.backgroundColor
alert(name)
alert(bgColor )
}

// -->
</script>
</head>
<body onload="return window_onload()">
<form id="form1" runat="server">
<div>
<table id="colorPicker">
<tr>
<td style="background-color :red;">c1
</td>
<td style="background-color:blue;">c2
</td>
</tr>
<tr>
<td style="background-color:green;">c3
</td>
<td style="background-color:yellow;">c4
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
 
Hi,

You are the man ... that solved the last part ... now I will look into
the link you sent ... which also seem to be the best idea with a web
service or some kind ... so I dont have to do full repost of the page,
if the user just want to change color ....

But what about security here ... ? Since I dont have the SesssionID or
anything at the webservice ?

would you just send it to the service, with some special random text
made at login time ... and also control the ip address .... ?

// ouT

ThatsIT.net.au said:
somthing like this, this will solve the clicnt side of the problem if I
understand it.
to send to the server can be solver by adding the values to a hidden
field and retrived on a future event, or you can send via the
ICallbackEventHandler. I have a sample on how to do this.
http://dev.thatsit.net.au/samples/aspnet/postback/default.aspx


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
<!--

function window_onload() {
var tds =
document.getElementById('colorPicker').getElementsByTagName('TD')
for (i = 0;i<tds.length;i++){
tds.onclick = tabClick
}
}

function tabClick(){
var name = this.innerText
var bgColor = this.style.backgroundColor
alert(name)
alert(bgColor )
}

// -->
</script>
</head>
<body onload="return window_onload()">
<form id="form1" runat="server">
<div>
<table id="colorPicker">
<tr>
<td style="background-color :red;">c1
</td>
<td style="background-color:blue;">c2
</td>
</tr>
<tr>
<td style="background-color:green;">c3
</td>
<td style="background-color:yellow;">c4
</td>
</tr>
</table>
</div>
</form>
</body>
</html>



Mikael Syska said:
Hi,

I have a problem ...:
If you look at http://syska.dk/upload/eb-14.jpeg you can see some
names to the right ... Alexandro, syska, resurrected.

I want an option to pick a new color for the name when clicking it.

I have a panel with 216 different colors, put into a <table>

But I can't figure out how to make it ... so that I know witch name
was clicked and still get the colorId ...

Also I want to have the "player list" in a updatePanel as I want to
use AJAX ....

I thought it was simple, but I can't figure out, how to do it ...

best regards
Mikael Syska
Click to expand...
Click to expand...
 
Mikael Syska said:
Hi,

You are the man ... that solved the last part ... now I will look into the
link you sent ... which also seem to be the best idea with a web service
or some kind ... so I dont have to do full repost of the page, if the user
just want to change color ....

But what about security here ... ? Since I dont have the SesssionID or
anything at the webservice ?

would you just send it to the service, with some special random text made
at login time ... and also control the ip address .... ?
Click to expand...

Not sure what you mean here.
Can you explain a bit more

// ouT

ThatsIT.net.au said:
somthing like this, this will solve the clicnt side of the problem if I
understand it.
to send to the server can be solver by adding the values to a hidden
field and retrived on a future event, or you can send via the
ICallbackEventHandler. I have a sample on how to do this.
http://dev.thatsit.net.au/samples/aspnet/postback/default.aspx


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
<!--

function window_onload() {
var tds =
document.getElementById('colorPicker').getElementsByTagName('TD')
for (i = 0;i<tds.length;i++){
tds.onclick = tabClick
}
}

function tabClick(){
var name = this.innerText
var bgColor = this.style.backgroundColor
alert(name)
alert(bgColor )
}

// -->
</script>
</head>
<body onload="return window_onload()">
<form id="form1" runat="server">
<div>
<table id="colorPicker">
<tr>
<td style="background-color :red;">c1
</td>
<td style="background-color:blue;">c2
</td>
</tr>
<tr>
<td style="background-color:green;">c3
</td>
<td style="background-color:yellow;">c4
</td>
</tr>
</table>
</div>
</form>
</body>
</html>



Mikael Syska said:
Hi,

I have a problem ...:
If you look at http://syska.dk/upload/eb-14.jpeg you can see some names
to the right ... Alexandro, syska, resurrected.

I want an option to pick a new color for the name when clicking it.

I have a panel with 216 different colors, put into a <table>

But I can't figure out how to make it ... so that I know witch name was
clicked and still get the colorId ...

Also I want to have the "player list" in a updatePanel as I want to use
AJAX ....

I thought it was simple, but I can't figure out, how to do it ...

best regards
Mikael Syska
Click to expand...
Click to expand...
Click to expand...
 
Hi again,

ThatsIT.net.au said:
Not sure what you mean here.
Can you explain a bit more
Click to expand...

Maybe it was a little bit to fast explained.

I did the communication with the server via a webservice ... and it
works, but since I dont have access to the Session object in the
webservice, I can't do any authentication.

So ... will the Session object be available with the link you provided ?

Or are there some other smart way I can do it ?

Since later I will implement users ... I will have to know if there are
authenticated, so they can't change other users data ...
[snip]

best regards
Mikael Syska
 
Mikael Syska said:
Hi again,



Maybe it was a little bit to fast explained.

I did the communication with the server via a webservice ... and it works,
but since I dont have access to the Session object in the webservice, I
can't do any authentication.

So ... will the Session object be available with the link you provided ?
Click to expand...

Yes it will

Or are there some other smart way I can do it ?

Since later I will implement users ... I will have to know if there are
authenticated, so they can't change other users data ...
Click to expand...

Yes it will work fine.

You might want to look up asp.net profiles to oraganize your user data.
it uses sql database to keep setting for users authenticated or not

[snip]

best regards
Mikael Syska
Click to expand...
 
ThatsIT.net.au said:
Mikael Syska said:
Hi again,



Maybe it was a little bit to fast explained.

I did the communication with the server via a webservice ... and it
works, but since I dont have access to the Session object in the
webservice, I can't do any authentication.

So ... will the Session object be available with the link you provided ?
Click to expand...

Yes it will

Or are there some other smart way I can do it ?

Since later I will implement users ... I will have to know if there
are authenticated, so they can't change other users data ...
Click to expand...

Yes it will work fine.

You might want to look up asp.net profiles to oraganize your user data.
it uses sql database to keep setting for users authenticated or not

[snip]

best regards
Mikael Syska
Click to expand...
Click to expand...

Nice ...

As I can see it ... it aint possible to have more than one Async
callback per page or am I missing something here ?

Since the implementation of the interface also specify that is going to
happen as return value and input param ...

btw ... thanks very much for the help, it has solved my problem.

// ouT
 
Mikael Syska said:
ThatsIT.net.au said:
Mikael Syska said:
Hi again,

ThatsIT.net.au wrote:

Hi,

You are the man ... that solved the last part ... now I will look into
the link you sent ... which also seem to be the best idea with a web
service or some kind ... so I dont have to do full repost of the page,
if the user just want to change color ....

But what about security here ... ? Since I dont have the SesssionID or
anything at the webservice ?

would you just send it to the service, with some special random text
made at login time ... and also control the ip address .... ?

Not sure what you mean here.
Can you explain a bit more

Maybe it was a little bit to fast explained.

I did the communication with the server via a webservice ... and it
works, but since I dont have access to the Session object in the
webservice, I can't do any authentication.

So ... will the Session object be available with the link you provided ?
Click to expand...

Yes it will

Or are there some other smart way I can do it ?

Since later I will implement users ... I will have to know if there are
authenticated, so they can't change other users data ...
Click to expand...

Yes it will work fine.

You might want to look up asp.net profiles to oraganize your user data.
it uses sql database to keep setting for users authenticated or not

[snip]

best regards
Mikael Syska
Click to expand...
Click to expand...

Nice ...

As I can see it ... it aint possible to have more than one Async callback
per page or am I missing something here ?

Since the implementation of the interface also specify that is going to
happen as return value and input param ...

btw ... thanks very much for the help, it has solved my problem.
Click to expand...



You can have as many as you want.

what I do is send a string with the "|" symbol as a separator

so I may have a string like this

"job1|value1|value2"

and from another event I may have

"job2|value1|value2|value3"

on the client side is split the string into array at the "|" symbol

the first value in the array "job1" or "job2" tells me what job needs doing

when I send back the result send it back the same way

"job1|result1|result2"

then I split it into a array on the client side using the first value to
identify the job again.
 
Back
Top