Solved

How to assign unique ids to checkboxes on a page by greasemonkey

Posted on 2011-02-22
12
507 Views
Last Modified: 2013-11-19
Hi,
This question is an extension of my previous question on how to keep the checkbox status by using cookies. The solution that was provided to me works fine except a bug in it. The bug come from the counters which generates almost unique ID for each checkbox on the page. I say almost because it is unique to the page but it is not globally unique. When you open a new page in the same domain the counter starts from 0 again and generate similar ID with the previous page. If you select new checkboxes on the new page and go back to the first page then in the same order, these checkboxes become also checked.

To overcome this problem I decided to use something unique on the page and decided to use some job numbers + the cluster name as the ID and it is totally unique. Now with some addition to the previous code I can create this unique ID. But I it generates nxn checkboxes instead of nx1. Becuase I only want one checkbox for each row.

I do something wrong around line 90-93.

Here is the part of my code that is causing the problem:

// Do the replacement of _regexp with _repstr. Also replace the checkbox ID wth the unique ID.
	   function do_replace_html_it(doc, element, match_re, replace_string) {
		match_re = new RegExp(match_re);
		$("tr").each(function (ind, row) {
		var cell = $(row).children("td:eq(3)");
		var jobID = $.trim(cell.text());
		var clusterName = getClusterName();
		mycave.log(jobID);
		if(element.innerHTML) {
			element.innerHTML = element.innerHTML.replace(match_re, function($1) { return replace_string.replace("mybox_X", "mybox"+clusterName+jobID) });		 
		}
		});	
	} 

Open in new window



The entire code in in the attachment. Please change the extension from .txt for .js
The code looks long but you can just focus on lines from 79 to 91.

The output representation I explained above is like this (Each x represents a checkbox):

x x x x 12345 aaaa bbbb
x x x x 23456 cccc dddd
x x x x 34567 eeee gggg
x x x x 45678 hhhh nnnn


When I look at the IDs for each checkbox ineach column, the checkboxes have the same ID. But the checkboxes in the same row have unique IDs.

So I want it to look like that with unique IDs:

x 12345 aaaa bbbb
x 23456 cccc dddd
x 34567 eeee gggg
x 45678 hhhh nnnn
cookieWork.user.txt
0
Comment
Question by:Tolgar
  • 7
  • 5
12 Comments
 

Author Comment

by:Tolgar
ID: 34956861
And this is the original question, if you want to see the initial issues which we have finally solved about keeping the state of these checkboxes

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_26820694.html


Thanks,
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 34956988
We may add the path of the current page and the page name in the id of the checkbox : location.pathname.replace(/\.|\//g,"_")

For example for this page the pathname (location.pathname) is : /Programming/Languages/Scripting/JavaScript/Q_26840492.html
So we get : _Programming_Languages_Scripting_JavaScript_Q_26840492_html
if(element.innerHTML) {
			element.innerHTML = element.innerHTML.replace(match_re, function($1) { return replace_string.replace("mybox_X", location.pathname.replace(/\.|\//g,"_") + "mybox" + clusterName + jobID) });		 
		}

Open in new window

0
 

Author Comment

by:Tolgar
ID: 34957881
Thank you for your reply. But this does not solve the problem completely. Because, path does not make it as unique as I want. I just tried it. Only this 123456 kind of numbers which I have showed in the example representation can make it completely unique.

But when I do it my way, it does not produce the expected result because there is "each" in the function call to go through each row. And this creates multiple checkboxes in one row.

Please let me know if you would like to get more clarification on this issue.

Thanks,
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34960756
replace : var counter = 0, counterJob = 0;
by :
counter = 0;
counterJob = 0;
0
 

Author Comment

by:Tolgar
ID: 34960858
Thank you for your reply.
I just tried it but it does not solve the issue. Because the webpage has frames and when I click on the these 123456 kind of number the path name does not change all the time. If there is way to catch the path for the frame, then it may solve  the problem.

Again, if we can extract the 123456 kind of number from each line and assign it to the checkbox id on that line then it can be a much more safe way of doing it.

Thanks,
0
 

Author Comment

by:Tolgar
ID: 34961422
Actually path name can partially solve the problem but the problem is the code cannot catch the full path name.

Here is an example path name:

http://mycave/cgi-bin/mytree.cgi?queue=Abcdef&job=123456

and here is the path that we catch and make it part of the checkbox ID:

_cgi-bin_jobtree_cgi

As you see we don't catch the entire path.

This can only solve the problem partially because it is not completely unique yet.

Here is a representation that explains why:

x 123456 aaaa bbbb
    x 234567 cccc dddd
    x 345678 eeee gggg
    x 456789 hhhh nnnn

If this is page the path will look like this:

http://mycave/cgi-bin/mytree.cgi?queue=Abcdef&job=123456

So the parent one which is not indented has its number in the path. However, the page may change during the day because the page does not stay as it is for a long time. So after two hours let's say it may look like this:

x 123456 aaaa bbbb
    x 987654 pppp qqqq
    x 234567 cccc dddd
    x 345678 eeee gggg
    x 456789 hhhh nnnn

As you see, the very first line under the parent (x 987654 pppp qqqq) is now having the second checkbox (remember each x represents a checkbox) on the page. If we select the checkbox on the previous page 2 hours ago at line (234567) then now when we open up the page the checkbox on line 987654 will also be selected out of our control.

So extracting this unique ID seems very crucial to overcome this problem.

Thanks,
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 

Author Comment

by:Tolgar
ID: 34961711
Hi,
I replaced:

location.pathname

with

location.href

Now I can catch the entire path. But as I said in my previous post this only solves the issue partially.

I am waiting for your reply.

Thanks,
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34962132
>I replaced: location.pathname with location.href
>But as I said in my previous post this only solves the issue partially

Sorry I was away, what is the problem with the full path + counter ?
0
 

Author Comment

by:Tolgar
ID: 34962358
Hi,
pathname was not catching the full the path. So I changed it to location.href. Now it is working fine.

But as I said in my two previous post, the cookie will leave some time. And if there is a change during that time to the page which is most probably going to happen, then the order will change and a job in the second place let's say will be selected even though it is not actually the right one.

I explained it in my two previous post with an example.

I closed the question but it would be great if we can solve this bug as well.

If you prefer I can open a new question for this issue.

Thanks,

0
 
LVL 82

Expert Comment

by:leakim971
ID: 34965960
>pathname was not catching the full the path. So I changed it to location.href. Now it is working fine.
Yes, you got it!

>But as I said in my two previous post, the cookie will leave some time.
Why / How ?

>And if there is a change during that time to the page which is most probably going to happen, then the order will change and a job in the second place let's say will be selected even though it is not actually the right one.
We can try to use GM_getValue and GM_setValue
Or if you submit a form we can save the states at this moment
Or using onbeforeunload too (user left the current page or are closing firefox)
0
 

Author Comment

by:Tolgar
ID: 34970458
Hi,
For now, the scenario that I have explained does not seem to happen. I'll test it for sometime and if I see any bugs then I will open another topic on this issue.

Thanks,
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34970995
You're welcome!

Initialy, I read we can't use GM_getValue and GM_setValue in onclick event. I'm not sure it apply now so if you encounter problem we will try to replace setCookie and getCookie by this two functions.

Have fun!
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
jquery, dropdown 4 36
Safari SVG Image Problem 1 19
spservices different results in IE and Chrome. 11 23
Adjust the position 3 7
Read about why website design really matters in today's demanding market.
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn how to count occurrences of each item in an array.
Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…

707 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

14 Experts available now in Live!

Get 1:1 Help Now