inherit
Peabrained Codebreaker
107114
0
Mar 11, 2020 7:47:27 GMT -8
Boy_Wonder
6,249
July 2007
natzy24
|
Post by Boy_Wonder on Apr 26, 2016 8:31:37 GMT -8
uh the "poorly coded javascript snippets" are from stack overflow. Last I checked that was one of the better places No I mean OTHER people's codes. Your code is fine. As in lets say user berk installs some obscure javascript that makes rain fall from the webpage. If they have id numbers of 1 2 3 4 etc. Your plugin would break. The ids are set in the plugin, I can change them when the final plugin is installed. 1, 2, 3 and 4 are just ones I'm using while testing
|
|
inherit
201984
0
Sept 11, 2023 1:23:07 GMT -8
P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓
Using My Talents Elsewhere
3,314
November 2013
pastuleo23
|
Post by P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ on Apr 26, 2016 10:04:26 GMT -8
No I mean OTHER people's codes. Your code is fine. As in lets say user berk installs some obscure javascript that makes rain fall from the webpage. If they have id numbers of 1 2 3 4 etc. Your plugin would break. The ids are set in the plugin, I can change them when the final plugin is installed. 1, 2, 3 and 4 are just ones I'm using while testing But you are leaving it up to the admin no? We don't want admins screwing things up
|
|
inherit
Peabrained Codebreaker
107114
0
Mar 11, 2020 7:47:27 GMT -8
Boy_Wonder
6,249
July 2007
natzy24
|
Post by Boy_Wonder on Apr 26, 2016 10:06:51 GMT -8
The ids are set in the plugin, I can change them when the final plugin is installed. 1, 2, 3 and 4 are just ones I'm using while testing But you are leaving it up to the admin no? We don't want admins screwing things up If I'm writing a plugin myself I'm normally doing it just for myself xD I get lazy
|
|
inherit
216224
0
Feb 7, 2024 9:48:11 GMT -8
Quozzo
407
November 2014
quozzo
|
Post by Quozzo on Apr 26, 2016 11:37:01 GMT -8
If you're concerned that another plugin will use the same ID's as one of the checkboxes, then it would be a good idea to cache the checkbox before inserting into the page (assuming you're actually inserting it into the page via JS and its not already there).
var myCheckbox = $("<input type='checkbox' />").prependTo("#content");
//some other stuff here;
myCheckbox.click(function(){ //the checkbox was stored in a variable, so you never lose track of it. var $this = $(this), checked = $this.is(':checked'); //more caching ;) if(checked) $this.prop('disabled', true); }); If you insert an element into the document, and then need to find it again, you're doing something wrong. You need to cache them and then use that reference instead of the sluggish method of checking the DOM.
If you want multiple checkboxes then store them all in an array, or a jQuery collection. var myCheckbox = $("<input type='checkbox' />"), //original checkbox checkBoxes;
myCheckbox.click(function(){ var $this = $(this), checked = $this.is(':checked'); if(checked) $this.prop('disabled', true); //some other code here, set a key maybe? });
for(var i=0;i<100;i++){ //change the number to something more suitable. checkBoxes = checkBoxes ? checkBoxes.add(myCheckbox.clone(true)) : myCheckbox; // Clones another checkbox and add it to the list, or uses the myCheckbox if it is the first. }
$('#content').prepend(checkBoxes);
^ Run in the console and check the top of the thread.
Do everything you can to the checkboxes before inserting them into the DOM. Changing the DOM is expensive, changing elements not in the DOM is not as resource intensive. This also includes checking the key and then altering the disabled property, but if a checkbox is clicked when in the DOM then obviously must be changed in the DOM.
Using obscure naming conventions to "mask" your elements/functions/whatever is never an option. Using variables in a scope so they can't be overwritten is the way it should be done. It's possible to expose variables that other plugins might need, but that's something else entirely.
|
|
inherit
Peabrained Codebreaker
107114
0
Mar 11, 2020 7:47:27 GMT -8
Boy_Wonder
6,249
July 2007
natzy24
|
Post by Boy_Wonder on Apr 26, 2016 11:52:21 GMT -8
If you're concerned that another plugin will use the same ID's as one of the checkboxes, then it would be a good idea to cache the checkbox before inserting into the page (assuming you're actually inserting it into the page via JS and its not already there). var myCheckbox = $("<input type='checkbox' />").prependTo("#content");
//some other stuff here;
myCheckbox.click(function(){ //the checkbox was stored in a variable, so you never lose track of it. var $this = $(this), checked = $this.is(':checked'); //more caching ;) if(checked) $this.prop('disabled', true); });
If you insert an element into the document, and then need to find it again, you're doing something wrong. You need to cache them and then use that reference instead of the sluggish method of checking the DOM. If you want multiple checkboxes then store them all in an array, or a jQuery collection. var myCheckbox = $("<input type='checkbox' />"), //original checkbox checkBoxes;
myCheckbox.click(function(){ var $this = $(this), checked = $this.is(':checked'); if(checked) $this.prop('disabled', true); //some other code here, set a key maybe? });
for(var i=0;i<100;i++){ //change the number to something more suitable. checkBoxes = checkBoxes ? checkBoxes.add(myCheckbox.clone(true)) : myCheckbox; // Clones another checkbox and add it to the list, or uses the myCheckbox if it is the first. }
$('#content').prepend(checkBoxes);
^ Run in the console and check the top of the thread. Do everything you can to the checkboxes before inserting them into the DOM. Changing the DOM is expensive, changing elements not in the DOM is not as resource intensive. This also includes checking the key and then altering the disabled property, but if a checkbox is clicked when in the DOM then obviously must be changed in the DOM. Using obscure naming conventions to "mask" your elements/functions/whatever is never an option. Using variables in a scope so they can't be overwritten is the way it should be done. It's possible to expose variables that other plugins might need, but that's something else entirely. I'm not concerned at all - I know my naming convention when its being used properly is going to literally be an id that summarises the stage for each checkbox So checkbox 1 might be called introdself for the id, the label being "Introduce yourself" etc This is why I was so confused about ids being an issue
|
|
inherit
216224
0
Feb 7, 2024 9:48:11 GMT -8
Quozzo
407
November 2014
quozzo
|
Post by Quozzo on Apr 26, 2016 11:58:29 GMT -8
Someone might use the same name, then you'll be screwed. It also adds time and effort to update those checkboxes with names, names that are not even necessary if you use the correct coding practices. If it wasn't important I wouldn't be here saying under no circumstance is it a good idea.
You're creating the checkboxes in JS, inputting them in JS and then trying to find them in JS! WHY!? You already had them. Just cache them and you have instant access. No need to scour the DOM again.
|
|
inherit
Peabrained Codebreaker
107114
0
Mar 11, 2020 7:47:27 GMT -8
Boy_Wonder
6,249
July 2007
natzy24
|
Post by Boy_Wonder on Apr 26, 2016 12:13:22 GMT -8
Someone might use the same name, then you'll be screwed. It also adds time and effort to update those checkboxes with names, names that are not even necessary if you use the correct coding practices. If it wasn't important I wouldn't be here saying under no circumstance is it a good idea. You're creating the checkboxes in JS, inputting them in JS and then trying to find them in JS! WHY!? You already had them. Just cache them and you have instant access. No need to scour the DOM again. I don't understand HOW to cache them. You're saying it as if its the easiest thing in the world. Consider it this way - I'm trying to learn how to use for loops using javascript, creating things like a list of checkboxes/radio buttons etc is surely better when I'm still trying to grasp the basics then going into caching and the like! I'm going to paraphrase what Peter has told me numerous times in skype here: There is no point trying to learn beyond the basics till you have got the basics down. I count: if/else/else if for loops and anything else along that line as a basic building block. Once I've mastered and got those to stick into my thick skull without getting my head in a muddle I'll move onto neater things.
|
|
inherit
216224
0
Feb 7, 2024 9:48:11 GMT -8
Quozzo
407
November 2014
quozzo
|
Post by Quozzo on Apr 26, 2016 12:25:01 GMT -8
Someone might use the same name, then you'll be screwed. It also adds time and effort to update those checkboxes with names, names that are not even necessary if you use the correct coding practices. If it wasn't important I wouldn't be here saying under no circumstance is it a good idea. You're creating the checkboxes in JS, inputting them in JS and then trying to find them in JS! WHY!? You already had them. Just cache them and you have instant access. No need to scour the DOM again. I don't understand HOW to cache them. You're saying it as if its the easiest thing in the world. Consider it this way - I'm trying to learn how to use for loops using javascript, creating things like a list of checkboxes/radio buttons etc is surely better when I'm still trying to grasp the basics then going into caching and the like! I'm going to paraphrase what Peter has told me numerous times in skype here: There is no point trying to learn beyond the basics till you have got the basics down. I count: if/else/else if for loops and anything else along that line as a basic building block. Once I've mastered and got those to stick into my thick skull without getting my head in a muddle I'll move onto neater things. caching just means storing them in a variable. You have several parts where you run $('.checkboxy') multiple times. Instead of running it multiple times you want to cache it store it in a variable. If you're creating that element, then you don't even need to find it because you should be caching it as soon as it's created. I'm all for learning the basics first. But you're not learning the basics, you're learining bad habits. If you don't stop it early on you will get used to it and never learn how to do it correctly. You might even start learning more and more bad habits and soon your codes become bloated and slow.
|
|
Former Member
inherit
guest@proboards.com
225992
0
Apr 19, 2024 23:48:59 GMT -8
Former Member
0
January 1970
Former Member
|
Post by Former Member on Apr 26, 2016 16:10:22 GMT -8
I'm not sure I ever agreed with the naming convention of storing DOM elements as caching. vars are more like pointers within a certain function scope they are declared.
for example:
// this is NOT "cached" because the DOM needs to be traversed to find it
var parent = $('.parent');
// this is not really cached either // its more of an element in the parent var (pointer) // people consider it cached because NO DOM transveral is needed! // which does increase performance
var child1 = parent.find('.child1');
|
|
inherit
201984
0
Sept 11, 2023 1:23:07 GMT -8
P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓
Using My Talents Elsewhere
3,314
November 2013
pastuleo23
|
Post by P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ on Apr 26, 2016 18:45:32 GMT -8
But you are leaving it up to the admin no? We don't want admins screwing things up If I'm writing a plugin myself I'm normally doing it just for myself xD I get lazy Its ok with me. I grew out of bad habits. I just mentioned two alternatives to your current way and it went over your head So it's not detrimental or anything. Don't worry about quozzo. Hes got best interests but no reason to confuse yourself. Most of what he says is intermediate stuff You finally got a code without syntax errors lol. Carry on
|
|
inherit
Peabrained Codebreaker
107114
0
Mar 11, 2020 7:47:27 GMT -8
Boy_Wonder
6,249
July 2007
natzy24
|
Post by Boy_Wonder on Apr 26, 2016 19:14:10 GMT -8
Stupid question though
$(".checkboxy").click(function() { $(this).attr("disabled", true); var checkbox = $(this).attr('id') key[checkbox]=1 pb.plugin.key('ToDoListKey').set({ value:{'box1':1} /*This also saves the key!*/ }); });
//P3 - Check if all checkboxes have been ticked and store to key. Each tickbox needs to store that its been ticked
$('.checkboxy').each(function(){ var checked = $(this).is(':checked') if(checked){ $(this).prop('disabled',true) } })
I have BOTH these that are doing effectively the same thing from what I can read. Just one is disabling on click.
Could I not store the checkboxes state also in the key (That its disabled and checked) on the click and if yes can you break it down how I'd do that? As then surely I'd be able to get rid of the second code that's checking if its checked to apply the disabled tag
|
|
inherit
201984
0
Sept 11, 2023 1:23:07 GMT -8
P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓
Using My Talents Elsewhere
3,314
November 2013
pastuleo23
|
Post by P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ on Apr 26, 2016 22:36:18 GMT -8
Stupid question though $(".checkboxy").click(function() { $(this).attr("disabled", true); var checkbox = $(this).attr('id') key[checkbox]=1 pb.plugin.key('ToDoListKey').set({ value:{'box1':1} /*This also saves the key!*/ }); });
//P3 - Check if all checkboxes have been ticked and store to key. Each tickbox needs to store that its been ticked
$('.checkboxy').each(function(){ var checked = $(this).is(':checked') if(checked){ $(this).prop('disabled',true) } }) I have BOTH these that are doing effectively the same thing from what I can read. Just one is disabling on click. Could I not store the checkboxes state also in the key (That its disabled and checked) on the click and if yes can you break it down how I'd do that? As then surely I'd be able to get rid of the second code that's checking if its checked to apply the disabled tag Yeah I mentioned that. You wanted to know how to apply disabled at that time not WHEN which is the on click. You don't need the code anymore. And why would you store the state in the key? That would be redundant. If its checked then its disabled. The data is true in both cases. The right question would be how to apply disabled and checked with the key data you have AS you make the checkboxes
|
|
inherit
Peabrained Codebreaker
107114
0
Mar 11, 2020 7:47:27 GMT -8
Boy_Wonder
6,249
July 2007
natzy24
|
Post by Boy_Wonder on Apr 26, 2016 23:00:46 GMT -8
Stupid question though $(".checkboxy").click(function() { $(this).attr("disabled", true); var checkbox = $(this).attr('id') key[checkbox]=1 pb.plugin.key('ToDoListKey').set({ value:{'box1':1} /*This also saves the key!*/ }); });
//P3 - Check if all checkboxes have been ticked and store to key. Each tickbox needs to store that its been ticked
$('.checkboxy').each(function(){ var checked = $(this).is(':checked') if(checked){ $(this).prop('disabled',true) } }) I have BOTH these that are doing effectively the same thing from what I can read. Just one is disabling on click. Could I not store the checkboxes state also in the key (That its disabled and checked) on the click and if yes can you break it down how I'd do that? As then surely I'd be able to get rid of the second code that's checking if its checked to apply the disabled tag Yeah I mentioned that. You wanted to know how to apply disabled at that time not WHEN which is the on click. You don't need the code anymore. And why would you store the state in the key? That would be redundant. If its checked then its disabled. The data is true in both cases. The right question would be how to apply disabled and checked with the key data you have AS you make the checkboxes Okay - can you explain to me how that would work? The reason I need to know this is so I know how to a) store the right data (this checkbox has been ticked so therefore it needs to be disabled to be true even when the page is reloaded for example) b) eventually I need to make a code to check whether the total for that 'type' of list is equal to the total for that array and if yes create a button to provide some form of award
|
|
inherit
201984
0
Sept 11, 2023 1:23:07 GMT -8
P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓
Using My Talents Elsewhere
3,314
November 2013
pastuleo23
|
Post by P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓ on Apr 27, 2016 1:22:57 GMT -8
Okay so is this right or have I messed something up somewhere (it's working but) $('#unapp').append('<input type="checkbox" id="'+pb.plugin.get('to_do_list').settings.unapp_chkbox[a].checkbox_id+'"class="checkboxy"value="'+pb.plugin.get('to_do_list').settings.unapp_chkbox[a].checkbox_label+'" ><label for="'+pb.plugin.get('to_do_list').settings.unapp_chkbox[a].checkbox_id+'">'+pb.plugin.get('to_do_list').settings.unapp_chkbox[a].checkbox_label+'<br /></label></form>'); } just add 'checked' and 'disabled' to the html here on the right box depending on the id of the box found in the .get() of the key
|
|
inherit
Peabrained Codebreaker
107114
0
Mar 11, 2020 7:47:27 GMT -8
Boy_Wonder
6,249
July 2007
natzy24
|
Post by Boy_Wonder on Apr 28, 2016 10:55:36 GMT -8
Okay I get that much but I mean how - would I be using attr or similar?
|
|